Was genau bewirkt clear:both?

    Guten Tag :~


    Ich bin HTML-/CSS-Anfänger und habe durch diese Seite bereits einen sehr schönen Einstieg in dieses Thema gehabt (ausführliches Lob sowie Kritik und mehr folgt, wenn ich das meiste durchgearbeitet habe) und das meiste ist auch durchwegs verständlich. Manche Dinge werden aber etwas kurz erklärt. Momentan mit ich bei dem Punkt "Fußzeile integrieren" (CSS) und Folgendes steht auf der Seite:


    Zitat

    (<!-- m --><a class="postlink" href="http://www.html-seminar.de/css-design-fusszeile-integrieren.htm">http://www.html-seminar.de/css-design-f ... rieren.htm</a><!-- m -->)
    Zum bisherigen Design kommt nun ein weiterer DIV-Bereich für die Fußzeile - dabei muss allerdings den vorherigen Bereich abgeschlossen werden, was durch ein "clear:both;" erfolgt. Die Fußzeile wird farblich hinterlegt, damit besser sichtbar und bekommt im oberen Bereich einen schwarzen Rand mit 2 Pixeln Breite zur Abgrenzung.


    Was ich nicht verstehe ist:

    Zitat

    dabei muss allerdings den vorherigen Bereich abgeschlossen werden, was durch ein "clear:both;" erfolgt.


    Was genau bewirkt clear:both? Es schließt also den vorherigen Bereich ab – aber wie macht sich das bemerkbar und wozu braucht man das?


    Danke im Voraus,
    HTML²


    Edit: Oha, ich sehe gerade, ich habe ins falsche Unterforum gepostet. Tut mir Leid. Es wäre nett, wenn ein zuständiger Moderator das Thema ins CSS-Unterforum verschieben könnte.


    Edit²: Danke sehr. :]

    Hey,


    hier eine Definition von clear, die es für meinen Geschmack ganz gut trifft:


    Zitat


    (engl. clear = leeren, freimachen, freihalten)


    Die Eigenschaft clear gibt an, auf welchen Seiten einer Elementbox keine vorhergehenden float-positionierten Elemente dargestellt werden dürfen. Anders ausgedrückt: Die mit clear bezeichnete Seite eines Elements wird von vorhergehenden Elementen freigehalten, deren float-Eigenschaft entweder right, left oder inherit ist.


    Das bedeutet: das aktuelle Element wird so weit nach unten geschoben, bis es sich, bezogen auf die angegebene Seite, unterhalb aller vorhergehenden floatierten Elementen befindet.


    Quelle: http://www.thestyleworks.de/ref/clear.shtml


    clear: both;


    bewirkt, dass der vorher gehende float-Bereich sozusagen "abgeschlossen" wird. Das ist wichtig, damit folgendes Layout nicht durch das vorhergehende float beeinträchtigt wirkt.


    Gruß
    Laura

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden