CSS Kochbuch

9.6 Mehrspaltige Layouts mit festen Breiten mit Hilfe von Floats

Problem

Es soll ein dreispaltiges Layout mit festen Breiten erstellt werden.

Lösung

Zuerst umgeben Sie die Inhalte mit div-Elementen. Diese haben id-Attribute, die hier zu Demonstrationszwecken auf die Positionierung der Elemente innerhalb der Seite verweisen (siehe Abbildung 9-13):

<div id="Kopfzeile">
 [...]
</div>
<div id="Hauptspalte">
 [...]
</div>
<div id="linkeSpalte">
 [...]
</div>
<div id="rechteSpalte">
 [...]
</div>
<div id="Fusszeile">
 [...]
</div>

Im nächsten Schritt umgeben Sie die div-Elemente für die Hauptspalte und die linke Spalte mit einem weiteren div-Element. Dieses erhält ein eigenes id-Attribut mit dem Wert enclose. Schließlich werden alle div-Elemente noch einmal mit ...