nicht angemeldet
Hallo,
die Frage ist simpel:
<body>
<div id="content">...</div>
<div id="nav">..</div>
</body>
Ich möchte die #nav auf der rechten Seite des Inhalts darstellen. Das mache ich, da der Bannerteil eh absolute Größen aufweist, naheliegenderweise mit position:absolute und right:0. Dann kriegt #content einen margin-right kriegt, der so breit wie die Navigation ist, und alle sind glücklich.
Naja, zumindest fast. Denn wird der Bildschirm sehr eng, dann krieg ich mit der Breite von #content Probleme. Ich hätte gerne eine Mindestbreite (min-width). Wenn ich allerdings mit der arbeite und dann den Bildschirm in diese Breiten verkleinere, wird der Bereich #nav sich mit dem Inhalt überlappen. Also setzte ich min-width für den <body>. Das funktioniert zwar, aber blöderweise setzt das "right:0" den Bereich #nav nicht an den rechten Rand des <body>s, womit das Problem gelöst wäre, sondern an den rechten Rand des Browserfensters.
Meine Frage: Gibt es irgendeine Lösung für das Problem, die das #nav-<div> *nach* dem #content-<div> im Quelltext behält? Denn ich könnte die HTML-Datei umschreiben zu
<body>
<div id="nav">...</div>
<div id="content">..</div>
</body>
Und anschließend #nav rechts um #content floaten lassen, doch komme ich damit auch nur bedingt zu einer Lösung, denn:
1. wenn die Mindestbreite zum Wirken kommt (schmales Browserfenster), dann wird #nav einfach unter #content rutschen und damit ganz verschwinden (ganz schlecht!)
und
2. Ist es nicht barrieremäßig/suchmaschinenmäßig schlecht, wenn die Navigation vor dem eigentlichen Inhalt steht? Ich dachte es sei am optimalsten, wenn der Inhalt im Quelltext ganz oben steht.
Kann mir jemand mit meiem Problem helfen? Gibt es eine Lösung dafür?
Grüße,
Sven