ClearFix vs Overflow - программирование

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

Я знаю о решении clearfix, а также устанавливаю свойство overflow в родительском контейнере div как "авто" или "скрыто". http://www.quirksmode.org/css/clearing.html Для меня настройка метода переполнения выглядит намного лучше, чем одно свойство. Я хочу понять, когда подход clearfix имеет преимущество над этим методом, потому что я вижу, что он используется очень часто.

Ответы

Ответ 1

Единственный раз, когда вам нужно использовать метод clearfix, который вставляет невидимый контент для очистки, - это если вам нужно, чтобы элемент был видимым, когда он переполняет элемент, к которому вы его применяете, в противном случае запуск hasLayout + overflow является золотым.

Обратите внимание, что в IE7 переполнение скрытых триггеров hasLayout. Не уверен в IE8.

#wrapper { width:80em; overflow:hidden; }

Метод выше будет отлично работать в большинстве случаев, если вам не нужно сказать, #header переполняет прошлое #wrapper..

#wrapper { width:80em; position:relative; }
#wrapper:after {  content:"."; clear:both; display:block; height:0; visibility:hidden; }
#header { position:absolute; top:-15px; left:-15px; }