nicht angemeldet
Hallo Jonathan, Hallo Sven,
- wenn die Mindestbreite zum Wirken kommt (schmales Browserfenster), dann wird #nav einfach unter #content rutschen und damit ganz verschwinden (ganz schlecht!)
Du solltest den Element, das sowohl die Navigation als auch den Inhalt enthält (typischerweise body) eine entsprechende Mindestbreite geben, dass beides nebeneinander hineinpasst.
das ist ein Argument. Danke :)
es funktioniert tatsächlich, wie ich gerade mit firebug durchgespielt habe. Aber die Navigation steht ganz oben und das ist unnötig, denn:
<body>
<div id="wrapper">
<div id="content">...</div>
<div id="nav">...</div>
</div>
</div>
wenn man #wrapper position:relative gibt, wird #nav sich absolut im wrapper positionieren. Wenn man #wrapper dazu noch eine Mindestbreite gibt, ist alles geregelt: Beim zu-klein werden des Browserfensters verharrt wrapper in der Breite und nav ist genau da, wo es hingehört. Perfekt!
Und es kommt noch besser: sogar für den Hintergrund von #nav, der als typischer Spaltenhintergrund über die gesamte Seite gehen soll, hab ich eine Lösung: Er wird nicht mehr dem <body> zugewiesen, was das gleiche Problem wie mit #nav position:absolute hatte, da der Hintergrund background-position: top right; hatte und damit beim Kleinerwerden des Browserfensters mit in den #content-Text reinfloss, sondern er wird dem #wrapper zugewiesen, mit genau den gleichen Eigenschaften wie für <body>.
Das Ergebnis: Zweispaltiges Layout mit absolut angeordneter #nav und trotzdem voller Flexibilität in Hinsicht Mindestbreite. Und es kommt noch besser: Dank der relativen Positionierung von #nav zu #wrapper ist man sogar mit der vertikalen Positionierung von #nav im Bezug auf die Gesamtseite viel flexibeler geworden, denn #nav fängt jetzt an, wo #wrapper anfängt, und das ist nach dem Ende des vorherigen Elements (typischerweise banner). Vorher musste dieses Verhalten durch einen in der Höhe absolut festgelegten Banner simuliert werden.
Vielen Dank,
Sven