Float beenden

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;
}