timofeygusevopal
@timofeygusevopal
asp.net core developer

Как сделать такую кнопку на css c логотипом слева и выравниваем с input-oм?

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
.in_el, .in_el div{ display: inline-block;
	margin-top: 20px;
	margin-left: 70px;
 }
.in_el input{ height: 30px;
	width: 300px;
	margin: -5px;
}
.button_ret{
	border-radius: 15px;
	height: 30px;
	width: 200px;
	background: #61A656;
	padding-bottom: 0px;
color: #FFFFFF;
margin-left: 1px;
vertical-align: middle;
padding: 5px 5px;
line-height: -10px;
color:white;
}
.button_ret a{ color: #FFFFFF;
	}


   </style>
</head>
<body>
	<div class="in_el">
   <input placeholder="Введите ваше имя" style="border-radius: 15px 0px 0px 15px;" type="text">
   <input placeholder="Телефон..." style="border-radius: 0px 15px 15px 0px;" type="text">
   <div class="button_ret"><img  src="img/contacts_calendar_book_6837.png"><a href="">Оставить заявку</a></div>

</body>
</html>
  • Вопрос задан
  • 119 просмотров
Решения вопроса 3
wapster92
@wapster92 Куратор тега CSS
Пример. Лучше не выбрасывать так код, а показывать в песочнице.
Ответ написан
warsand
@warsand
Экспериментатор

Чем шире окно браузера, тем шире "input". Кнопку отправки - не расширяю... )))
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы