Во-первых, проблема не в том, что блочные элементы разрушаются при перемещении их дочерних элементов. На самом деле проблема не имеет ничего общего с очисткой.
Проблема заключается в следующем. Предположим, у меня есть серия плавающих элементов типа:
<div class="column">Column 1</div>
<div class="column"></div>
<div class="column">Column 3</div>
С css:
div.column { float: left; width: 200px; }
Средний столбец рухнет в последних версиях Firefox и Safari, хотя, видимо, не в IE7. Мне нужно поведение IE7.
Я понимаю, что могу добавить , и он будет держать div открытым, но это не работает для меня в этом случае, потому что у меня также есть объявление, подобное этому:
div.column input { width: 100% }
У меня есть ряд столбцов, расположенных в табличном формате, с определенными условиями, вызывающими исчезновение полей ввода. Проблема в том, что когда вход исчезает, поле исчезает. Если я добавлю , это приведет к переносу div. Просто чтобы ответить на первые вопросы:
- Почему вместо этого я не использую таблицу? Поскольку я использую Scriptaculous Sortable для перетаскивания строк, что не работает с таблицами
- Почему бы мне не использовать меньшую ширину пикселя, чтобы оставить место для
? , поскольку width: 100% более точен во всех браузерах.
- Почему бы мне не добавить
, когда я скрываю ввод Я могу в конечном итоге прибегнуть к этому, но в JS это будет отчасти уродливо, поэтому я надеюсь на лучший способ.
У кого-нибудь есть какие-нибудь умные хаки? Так как Safari и Firefox ведут себя таким образом, я предполагаю, что это официально санкционированное поведение. Где это обсуждается в спецификациях W3C?