Float beenden
20. Dezember 2009 in Css
Float lässt nachfolgende Elemente umfließen. Möchte man den Textumfluss abbrechen, so kommt ein zusätzliches div-Element, welches mit clear: das Umfließen der linken bzw. rechten Seite oder sogar beiden Seiten beendet, sehr gelegen.
Wer lieber auf das clear-Blockelement verzichtet, kann sich den folgenden Trick angewöhnen: gebt dem äußersten umschließenden Block eine Breite und Höhe sowie die CSS-Eigenschaft overflow: auto, die dafür sorgt, dass der Browser bestimmt, ob übergroßer Inhalt abgeschnitten wird oder herausragen soll, wenn er die Grenzen des Elements überschreitet.
Bevor ich´s vergesse, das display: block kann man sich bei gefloateten Elementen sparen, sie werden automatisch zu Blockelementen.
Hier ein Beispiel:
div.container {
border: 1px solid #000000;
overflow: hidden;
width: 100%;
}
div.left {
width: 45%;
float: left;
}
div.right {
width: 45%;
float: right;
}
