webdesign freiburg - dizign.de

Finanztipps ohne Layout-Tabellen

Für ein eigenes Projekt, das sich mit den Themen "Finanzierung von Konsumgütern" beschäftigt, habe ich ein zweispaltiges Layout mit fester Breite gewählt.

Der logische Aufbau besteht aus vier div-Containern:

 
dem <div id="drumrum">
darin den <div id="drumrum">
sowie <div id="menudiv">
und <div id="inhalt">
 

Der div mit der id "drumrum" dient dabei lediglich der zentrierten Ausrichtung.
Das Menü wurde mittels SSI implementiert und liegt in einer externen Textdatei. Somit bedarf es nur der Änderung an dieser Datei um neue Menüpunkte einzupflegen.
Wie es gemacht wird ist unter dizign.de/ssi/menu.shtml nachzulesen.

Der Menü und der Inhaltscontainer werden mittels der Anweisung float:left umflossen.

Insgesamt ergibt sich so ein sehr schlanker und logisch aufgebauter Quelltext. Durch die Einteilung in verschiedene Div´s ist es ohne großen Aufwand möglich zum Beispiel das Menü nach rechts oder oben zu verschieben. Ebenso können Menüänderungen sehr schnell umgesetzt werden.

Links:
Projekt Finanzierungen Vergleich

Hilfreiche Ressoucen:
Look Ma, No Tables - glish.com
CSS bei selfhtml.org