Что такое стиль CSS clear и как он используется?

Question

Что делает следующее:

<div style="clear:both"></div>

и как это используется?

Answer 1

Он «очистит» любые всплывающие элементы, которые появляются над ним в исходном коде HTML. Если у вас есть плавающие элементы в элементе контейнера, контейнер будет иметь высоту 0, а плавающие элементы будут «выплескиваться». Очистка их позволит контейнеру принять правильную высоту.

Смотрите здесь для лучшего объяснения .

Answer 2

Это сделано для того, чтобы элементы float оставались на плавающие после этого div. По моему мнению, использовать это - плохая идея, и лучше использовать clearfix в div-обертке, содержащем плавающие элементы.

Answer 3

Если у вас есть float элементы, clear:both не будет обтекать их, но будет отображаться после них. В некотором смысле, это сбрасывает плавающие.
clear:both также полезно для задания элемента высоты его плавающих дочерних элементов - без него элемент был бы меньше своих дочерних элементов, что непривлекательно.

Менее распространенное использование - для решения проблем IE6, когда страница не отображается должным образом. Иногда элементы отображаются за цветом фона, и ясно: оба могут это исправить.