#html #css
Вопрос:
Я создаю свой первый проект Laravel и, похоже, не могу понять, как выровнять свои поля. У меня есть 2 текстовых поля в строке в моей форме, но третье находится ниже первых 2. Есть ли способ, чтобы все 3 были на одной линии?
Мой код:
lt;div style="float:left;" style="margin-left: 200px;" gt; lt;label for="recipient-name" class="col-form-label"gt;Admin time (Hours):lt;/labelgt; lt;input type="number" style="width: 7em" name="admin_time" class="form-control" id="recipient-name" min="1" step="1" requiredgt; lt;/divgt; lt;div class="mb-3" style="margin-left: 200px;"gt; lt;label for="recipient-name" class="col-form-label"gt;Work time (Hours):lt;/labelgt; lt;input type="number" style="width: 7em" name="work_time" class="form-control" id="recipient-name" min="1" step="1" requiredgt; lt;/divgt; lt;div class="mb-3" style="margin-left: 400px;"gt; lt;label for="recipient-name" class="col-form-label"gt;Work time (Hours):lt;/labelgt; lt;input type="number" style="width: 7em" name="rest_time" class="form-control" id="recipient-name" min="1" step="1" requiredgt; lt;/divgt; Комментарии:
1. Это вопрос css. Взгляните на css flexbox вместо плавающего. Вы используете bootstrap? в этом случае взгляните на сетку в документах
Ответ №1:
Используйте и учитесь flexbox вместо float: left;
lt;div style="display: flex;"gt; lt;divgt; lt;label for="recipient-name"gt;Admin time (Hours):lt;/labelgt; lt;input type="number" style="width: 7em" name="admin_time" id="recipient-name" min="1" step="1" requiredgt; lt;/divgt; lt;divgt; lt;label for="recipient-name"gt;Work time (Hours):lt;/labelgt; lt;input type="number" style="width: 7em" name="work_time" id="recipient-name" min="1" step="1" requiredgt; lt;/divgt; lt;divgt; lt;label for="recipient-name"gt;Work time (Hours):lt;/labelgt; lt;input type="number" style="width: 7em" name="rest_time" id="recipient-name" min="1" step="1" requiredgt; lt;/divgt; lt;divgt;