nicht angemeldet
Es heisst ja immer man solle Tabellen nicht für das Design verwenden, sondern viel eher DIVs.
Nein:
Du sollst dir mit Tabellen deinen Code nicht unleserlich gestalten.
;)
Aber wie wandle ich eine so einfache Struktur effektiv in genau das selbe nur mit DIVs um?
...
Die einfachste Umwandlung wäre theoretisch:
....
Allerdings verschiebt sich durch den Rahmen das content-div unter das navi-div, aufgrund von float.
Wie kann man dieses Problem am elegantesten umgehen?
Kein Border: Das ist keine Lösung
(Hintergrund-)Bild statt Border: Das ist auch keine Lösung
Fixe Grössen: Das ist auch keine Lösung
sidebar{ float:left; width: 20%; padding:0; border:0;}
content {margin-left:20%;}
sidebar ist jetzt der Container für deine Navigation.
Relative Breiten
Das Gleiche mit em Breiten:
sidebar{ float:left; width: 10em; padding:0; border:0;}
content {margin-left: 10em;}
Und wenn man dem sidebar eine feste Breite geben will:
Das Gleiche mit em Breiten:
sidebar{ float:left; width: 150px; padding:0; border:0;}
content {margin-left: 150px;}
Wenn du jetzt noch per se willst, dass der sidebar immer die gleiche Höhe wie der Content habe, so ist "Faux Column" dein Suchstichwort.
mfg Beat