Свойство float

Свойството float - задава плаващи елементи, които ще се обвиват от текст. Свойството float понякога се използва заедно със свойството clear, което спира обвиването на елемента.

Въпреки че първоначално float е било създадено за вмъкване на плаващи елементи в текст, в момента се използва много широко и нестандартно за изграждане на оформления.

Синтаксис

селектор {
	float: left | right | none;
}

селектор {
	clear: both | left | right | none;
}

Стойности за float

Стойност	Описание
`left`	Елементът ще плава отляво, а текстът ще се обвива около него отдясно.
`right`	Елементът ще плава отдясно, а текстът ще се обвива около него отляво.
`none`	Няма обвиване.

Стойност по подразбиране: none.

Стойности за clear

Стойност	Описание
`left`	Спира обвиването отляво.
`right`	Спира обвиването отдясно.
`both`	Спира обвиването както отляво, така и отдясно.
`none`	Няма спиране на обвиването.

Стойност по подразбиране: none.

Пример

Използваме float нестандартно, като поставим елементите от списъка в линия:

<ul>
	<li>1</li>
	<li>2</li>
	<li>3</li>
	<li>4</li>
	<li>5</li>
</ul>

li {
	float: left;
	border: 1px solid red;
}

Вижте също

свойство clear,
което спира float за горните елементи