Flexible Rahmen mit CSS2

In den Anfangszeiten des Internetbooms habe ich ziemlich hässlichen HTML-Code geschrieben, um Webseiten mit dem Aussehen und Verhalten zu versehen, das ich mir vorgestellt hatte. Ich habe Stunden damit zugebracht, die zahllosen Grafiken zu erstellen, die ich für Mouseover-Effekte und Menüleisten benötigte, nur um hinterher feststellen zu müssen, dass es viel zu lange dauerte, sie mit einem 28,8er-Modem herunterzuladen. Und ich sehnte die Zeiten herbei, wenn eine ausreichende Bandbreite dafür sorgen könnte, dass meine Webseiten rasch geladen würden.

Ironischerweise haben wir inzwischen zwar solche Bandbreiten, doch sind grafiklastige Webseiten ziemlich aus der Mode gekommen. Denn zum Glück ermöglicht nun CSS2 (Cascading Style Sheets 2) mit seinem border-Attribut genau die optischen Effekte, die früher nur mit Grafiken möglich waren.

Seitenlayout

Ich habe früher eine Menge Zeit damit verbracht, mit table-Tags, Blind-GIFs und Hintergrundfarben herumzubasteln, um meinen Seiten das gewünschte Aussehen zu verleihen. Leider war der HTML-Code im Ergebnis oft unnötig aufgebläht. Außerdem war es schwierig und zeitaufwendig, das Layout nachträglich zu ändern.

Mit CSS2 und vor allem seinem border-Attribut kann man das Layout für eine komplette Seite ohne einen einzigen table-Tag oder ein Blind-GIF erstellen. Das Layout in Abbildung A dient hierfür als Beispiel.

Abbildung A: Beispiel-Layout für eine Webseite