@asadov11

Не адаптируется форма?

5a927d260d475790661901.png
По идее input поля должны уменьшаться по размеру контейнера, не? Вообще не вкуриваю, аможет просто туплю и не вижу очевидного. Помогите пожалуйста

Вот код

<div class="contact-form">
			<form action="#">
				
				<div class="inline">

					<div class="form-field">
						<label for="name">Name</label>
						<input type="text" name="name" class="form-control">
					</div>
					<div class="form-field">
						<label for="email">Email</label>
						<input type="email" name="email" class="form-control">
					</div>

				</div>

				<div class="form-field">
					<label for="message">Message</label>
					<textarea name="message" class="form-control"></textarea>
				</div>
				
				<div class="button-container">
					<input type="submit" value="Send" class="button">
				</div>

			</form>
		</div>


.inline
	display: flex
	justify-content: space-between
	.form-field
		&:first-child
			margin-right: 15px
		&:last-child
			margin-left: 15px

.contact-form
	margin-top: 100px
	
.button-container
	display: flex
	justify-content: flex-end
	align-items: center
	margin: 0
	.button
		margin-top: 35px
		font-size: 16px
		padding: 5px 60px


.form-field
	font-weight: 300
	.form-control
		display: block
		width: 100%
		min-width: 360px
		height: 45px
		border: 1px solid #999
		border-radius: 1px
		transition: all 0.3s
		background-color: #fff
		font-weight: 300
		outline: none
		&:focus
			border-color: $accent
	textarea
		min-height: 165px


/* @media */
.inline
		flex-direction: column
		margin-bottom: 20px
		.form-field
			&:first-child
				margin-right: 0
				margin-bottom: 20px
			&:last-child
				margin-left: 0
  • Вопрос задан
  • 75 просмотров
Решения вопроса 1
Пригласить эксперта
Ответы на вопрос 1
AskMy
@AskMy
иногда решаю задачки и задаю глупые вопросы
вот эта строчка в<head></head> есть ?
<meta name="viewport" content="width=device-width, initial-scale=1">
Ответ написан
Ваш ответ на вопрос

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

Войти через TM ID
Похожие вопросы