Webdesign - Webseiten planen, gestalten - Free-Hack Library

CSS
Schwebende Positionierung mit „float“
Float ist im Gegensatz zu static, relative, absolute und fixed eine
eigenständige CSS-Eigenschaft. Ein schwebendes Element ist aus
dem normalen Textfluss herausgelöst, das nachfolgende Element
umfließt das schwebende Element so lange, bis es entweder „zu
Ende“ ist oder bis es mit „clear“ beendet wird.
Dieses Verhalten ist insofern interessant, als dass die nachfolgenden
Elemente ein „float“ auch dann noch umfließen, wenn es sich um
Blockelemente wie z. B. Absätze () handelt. Erst die Eigenschaft
„clear“ kann das Umfließen beenden (Abb. 4.4.9f).
Schwebende Elemente
Absatz 1
Absatz 2
Absatz 3
Absatz 4
Absatz 5
Absatz 6 (clear)
Absatz 4
.floatLeft {
float: left;
padding-right: 0.5em;
}
.clear {
clear: both;
}
float:
left, right, none
Legt fest, wie die nachfolgenden Elemente das Element
umfließen.
TECHNISCHE
GRUNDLAGEN
4
Abb. 4.4.9f: Schwebende Elemente.
Das obere Bild wird bis zum Ende umflossen.
Erst das „clear“ von Absatz 6 beendet das
Umfließen des 2. Bildes vorzeitig.
95