Clearfix на CSS

Много уеб дизайнери са чували за clearfix на CSS. Clearfix - метод поплавък отмените действието, без да променя структурата на HTML-документ. Този метод Imposer някои много широко използван, така че реших да ви разкажа за него в тази статия.

Нека разгледаме един пример:

Всичко друго, но блок "Мазето на сайта" е една и съща в дясно на изображението, а не под него. Какво е решението на този проблем? Очевидно е, че ние трябва просто да добавите друг блок, флоат Ефект на премахване:

Сега всичко си идва на мястото, обаче, ние сме се променили структурата на HTML-кода. добавяне странно празен блок. Така clearfix избягва това. Не блок да добавите, не е необходимо, но достатъчно, за да пишат на CSS код, както следва:

#article: след съдържание: "";
ясно: и двете;
дисплей: маса;
>

след псевдо-елемент позволява да показвате част от съдържанието след съдържание на елемента. Това съдържание е определено в съдържанието на собственост. Точно това съдържание е табличен елемент и е отменил поплавък ефект.

Този метод работи във всички съвременни браузъри, така че е крос браузър.

Бих добавил, че аз съм свикнал да добавите блок с ясно: и двете; в HTML. но за да ви запозная с clearfix в CSS Смятам също така, че е необходимо.

Препоръчайте тази статия на приятел:

Ако сте харесали сайта, линк към него (на вашия сайт, форум, при контакт)

Тя изглежда така:

BB-код справка за индекса (например, можете да го поставите в подписа):

<





?PHP включва ($ _SERVER [ "DOCUMENT_ROOT"] "/ vstavki / blokvtext2.html".); ?>