nicht angemeldet
Hallo,
Deine Menüspalte hat float: left und in der Hauptspalte verwendest du <div class="clr"></div> mit clear: both. Das Clearing sorgt dafür, dass dieses Element und alle folgenden Elemente in der Spalte unterhalb des Menüs positioniert werden. So funktioniert die clear-Eigenschaft.
Du willst hier vermutlich, dass clear sich nur lokal auf Floats innerhalb der Hauptspalte auswirkt und nicht auf die floatende Menüspalte. Das kannst du erreichen, indem du die Hauptspalte zu einem »Block Formatting Context« macht. Dann wirkt sich das clear nämlich nur auf diesen Kontext aus, nicht darüber hinaus.
Es gibt verschiedene Möglichkeiten, das zu erreichen. Eine ist, die Hauptspalte ebenfalls floaten zu lassen. Oder ihr display: table zu geben. In diesen beiden Fällen muss eine Breitenangabe vergeben werden. Eine weitere Möglichkeit ist overflow: auto oder overflow: hidden. Das ist sehr einfach, kann aber unerwünschte Nebenwirkungen haben.
Hintergrund:
http://blog.selfhtml.org/2006/01/31/css-spaltenlayout/#float-verschachteln
http://blog.selfhtml.org/2006/01/31/css-spaltenlayout/#wunderwaffe-overflow
http://www.yuiblog.com/blog/2010/05/19/css-101-block-formatting-contexts/
http://www.youtube.com/watch?v=8YtQwv1cUVs
Grüße,
Mathias