Архив за Апрель 2007 года

Обрамляем поплавки не нарушая семантики

20:13, 26-ое Апреля 2007, Автор: Q-Zma, Рубрики: HTML/CSS

Очень часто приходится использовать поплавки, при этом ещё чаще возникает необходимость обрамления их родительским элементом. В соответствии со спецификацией HTML, блок, вмещающий в себя поплавки, их не обрамляет. Стандартным решением этой проблемы является добавление невидимого элемента после поплавков с установкой свойства clear, однако, это нарушает семантику кода, добавляется какой-то никому нафиг не нужный элемент, который не несёт никакой смысловой нагрузки. Ну и мать его так, не нужен он нам больше. Совсем:

ul.menu {
	display:block;
	list-style:none;
	margin:0;
	padding:0;
}
ul.menu li {
	float:left;
	width:25%;
	text-align:center;
}
ul.menu:after {
	/* для «нормальных» браузеров */
	content:".";
	display:block;
	height:0px;
	font-size:0px;
	line-height:0px;
	overflow:hidden;
	clear:both;
	visibility:hidden;
}
ul.menu {
	height:1%;
}
html>/**/body ul.menu {
	height:auto !important;
}
<ul class="menu">
	<li>One</li>
	<li>Two</li>
	<li>Three</li>
	<li>Four</li>
</ul>


Апрель 2007
Пн Вт Ср Чт Пт Сб Вс
« Янв   Июн »
 1
2345678
9101112131415
16171819202122
23242526272829
30  
Вы просматриваете ежемесячный архив Q-Zma's Burrow за Апрель 2007 года.

Поиск

Архивы

Категории

Разное

Изменения

Рекомендую

  • WordPress
  • Get Firefox! b2evolution

Стандарты

  • Valid XHTML Transitional 1.0! Valid CSS!
  • Valid RSS!