Используя приведённый код HTML, добавьте к нему стили, чтобы получить результат, показанный на рис. 1.
Рис. 1
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Арабский текст</title>
</head>
<body>
<form>
<input type="search" placeholder="Поиск по сайту">
<button class="btn-search"><img src="image/icon_zoom.svg" alt=""></button>
</form>
<form lang="ar">
<input type="search" placeholder="ابحث في الموقع">
<button class="btn-search"><img src="image/icon_zoom.svg" alt=""></button>
</form>
</body>
</html>
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Арабский текст</title>
<style>
form[lang="ar"] {
direction: rtl;
}
input[type="search"] {
vertical-align: top;
}
.btn-search {
padding: 0;
border: 0;
background: none;
}
.btn-search img {
width: 20px; height: 20px;
}
</style>
</head>
<body>
<form>
<input type="search" placeholder="Поиск по сайту">
<button class="btn-search"><img src="image/icon_zoom.svg" alt=""></button>
</form>
<form lang="ar">
<input type="search" placeholder="ابحث في الموقع">
<button class="btn-search"><img src="image/icon_zoom.svg" alt=""></button>
</form>
</body>
</html>