Предположим, вы хотите создать форму с метками для ввода и сделать ее каким-то образом отзывчивой, отображая как можно больше полей ввода вместе с их метками в каждой строке. Для этого я подумал об автоматическом переносе пробелов: нет пробела между метками и полями ввода, но пробел между каждой группой.
<body>
<form>
<label for="aa">AA</label><input type="text" name="aa" id="aa" />
<label for="bb">BB</label><input type="text" name="bb" id="bb" />
<label for="cc">CC</label><input type="text" name="cc" id="cc" />
<label for="dd">DD</label><input type="text" name="dd" id="dd" />
<label for="ee">EE</label><input type="text" name="ee" id="ee" />
<label for="ff">FF</label><input type="text" name="ff" id="ff" />
</form>
</body>Как видите, между каждой «группой» метка + ввод есть пробел из-за разрыва строки. Но это, похоже, не подходит для автоматической упаковки, поскольку кажется, что упаковка выполняется между входами и метками почти всегда. Я хочу обернуть пространство, а не между меткой и вводом!
Что я делаю неправильно ? Хотя я знаю, что объединение каждой группы в другой элемент будет работать, я хотел бы, чтобы мой код был как можно более легким. Я попробовал немного CSS, но не смог этого сделать.
Заранее спасибо за помощь!
