Zwei Spalten

CSS-Layoutentwurf mit zwei Spalten.

Zweispaltige Layouts, die früher mit zweckentfremdeten Layouttabellen ganz leicht zu realisieren waren, sind mit CSS leider nicht so einfach umsetzbar, da der veraltete Internet Explorer auch in Version 6 noch immer nicht das dafür benötigte display:table-cell versteht. Ohne diese CSS-Eigenschaft aber sind die Spalten nicht immer gleich hoch – meist aber soll es doch so aussehen wie auf dieser Seite.

Aber es geht doch – der wichtigste Trick ist, daß der Navigationscontainer keine Hintergrundfarbe bekommt. Es scheint hier das Grau von body hindurch, wodurch die Illusion entsteht, der Container wäre immer genau so hoch wie sein rechter Nachbar.

Modernere Browser als der IE bekommen ein echtes display:table-cell, die Navigation darf also eine eigene Farbe haben.

Der CSS-Code muß vor Netscape 4 und IE 4 versteckt werden.

Das nächste Beispiel setzt noch einen Seitenkopf über die beiden Spalten.

Getestet mit:

Bubax