Eigenschaft float

Die Eigenschaft float - definiert schwebende Blöcke, die von Text umflossen werden. Die Eigenschaft float wird manchmal zusammen mit der Eigenschaft clear verwendet, welche das Umfließen des Elements aufhebt.

Obwohl float ursprünglich für das Einfügen von umflossenen Blöcken in Text erdacht wurde, wird es heutzutage sehr weit verbreitet und auf nicht standardisierte Weise für den Aufbau von Layouts verwendet.

Syntax

Selektor {
	float: left | right | none;
}

Selektor {
	clear: both | left | right | none;
}

Werte für float

Wert	Beschreibung
`left`	Der Block schwebt links, und der Text umfließt ihn rechts.
`right`	Der Block schwebt rechts, und der Text umfließt ihn links.
`none`	Kein Umfließen.

Standardwert: none.

Werte für clear

Wert	Beschreibung
`left`	Hebt das Umfließen von links auf.
`right`	Hebt das Umfließen von rechts auf.
`both`	Hebt das Umfließen sowohl von links als auch von rechts auf.
`none`	Keine Aufhebung des Umfließens.

Standardwert: none.

Beispiel

Wir verwenden float auf nicht standardisierte Weise, indem wir die Listenelemente in einer Reihe anordnen:

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

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

Siehe auch

die Eigenschaft clear,
die float für darüberliegende Elemente aufhebt