Direktnavigation

Weitere Infos

Sie lesen:
LB Teil 1 (2009)

Little Boxes Teil 1 (Cover)

Aktuell (2015)
Einstieg in CSS

Einstieg in CSS (Cover)


2. Auflage!

Einstieg in CSS (Cover)

Beispielseiten

Inhaltsbereich

17.4 Dreispaltiges, vollständig flexibles Layout

Die Erweiterung des zweispaltigen auf ein dreispaltiges Layout bringt keine neuen Tricks, sondern ist im Grunde genommen nur das Anwenden des bisher Gelernten. Das Schema sieht so aus:

Abbildung 17.11: Schema für ein vollständig flexibles dreispaltiges Layout
Abbildung 17.11: Schema für ein vollständig flexibles dreispaltiges Layout

Probieren Sie es einfach einmal aus. Kopieren Sie die Dateien aus dem Basisordner für diesen Abschnitt und versuchen Sie Ihr Glück. Hier noch ein paar Hinweise:

  • Im HTML benötigen Sie doppelte divs für #navibereich, #textbereich und #sidebar.
  • Im CSS müssen Sie die Hintergrundgrafik für #wrapper und sowohl Breite als auch Padding für die drei doppelten div-Elemente anpassen.
  • Für #textbereich müssen Sie den Margin links und rechts ändern und den Hintergrund mit ein bisschen Deckweiß übertünchen.
  • Für den IE6 vergeben Sie am einfachsten mit einen Sternchen-Hack für alle Prozentzahlen wieder feste Pixelbreiten.

Falls es gar nicht klappt, schauen Sie sich einfach die Webseiten und die bildschirm.css im Ordner fertig genauer an. Viel Spaß beim Probieren.