Как передвинуть текст слева от input'a?

Добрый день, есть код:
<div class="form-row">
	<div class="col-md-4 mb-3">
		<label class="form-label" for="address">Адрес: </label>
		<input type="text" class="form-control" id="address" name="address" placeholder="Адрес" required="">
	</div>
	<div class="col-md-4 mb-3">
		<label class="form-label" for="metro">Метро: </label>
		<input type="text" class="form-control" id="metro" name="metro" placeholder="Ближайшая станция метро" required="">
	</div>
</div>

CSS
.form-row {
    display: flex;
    margin-right: -5px;
    margin-left: -5px;
}

.form-control {
    display: block;
    width: 100%;
    height: calc(1.47em + 1rem + 2px);
    padding: 0.5rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.47;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
}

Как сделать текст слева от инпутов, как на скриншоте ? Спасибо.
5e26e96280a20117438668.jpeg
  • Вопрос задан
  • 128 просмотров
Решения вопроса 1
Bavashi
@Bavashi
В CSS поменяйте у класса .form-control значение display: block на display: inline и удалите width: 100%. Только имейте в виду, что это изменение затронет другие элементы использующие класс .form-control. Поэтому можно его скопировать и назвать по-другому и прописать в нужных элементах. Например, так:

Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Kozack
@Kozack
Ну, вы бы хоть в документацию заглянули
https://getbootstrap.com/docs/4.4/components/forms...
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
17 февр. 2020, в 19:40
500 руб./за проект
17 февр. 2020, в 19:36
5000 руб./за проект
17 февр. 2020, в 19:27
200 руб./в час