Hilfe bei CSS-Layout

[Beat]

Ich habe Probleme bei der erstellung eines CSS-Layout. Undzwar soll folgender Code

snip

so aussehen: http://x4rd3n.bplaced.net/selfhtml_css_layout/. Die Schwierigkeit besteht für mich darin, dass das Content-Element unter der Navigation sitzt und nicht mittendrin. Dabei will ich nur ohne das height-Attribut bei #navi auskommen, da die Anzahl an Elementen in der Navigation anpassbar sein soll.

Ich schildere dein Problem mal mit meinen Worten:
Damit die Unterlisten so dargestellt werden können, dürfen sie weder vom Typ display: static noch relative sein.
Damit ist es nicht möglich, dass eine Höheninformation aus diesen Unterlisten in den normalen Flowcontent zurückgeführt werden kann.

Dein Problem liesse sich derzeit nur mit Javascript lösen.
Dabei musst du für Hauptliste und beide Unterlisten den y Wert des letzten Elements auslesen.
Um dann den Content zu versetzen, musst du entweder dessen margintop manipulieren, oder wiederum mit absoluter Positionierung spielen.

Deine Navigation, welche den Content nicht verdecken darf, impliziert, dass sie permanent sichtbar ist.
Eine solche Navigation KANN nicht beliebig erweiterbar sein, weil Bildschirme nicht beliebig gross sind.

Du musst also irgend ein Konzept finden, wie du mit mangelndem Platz auskommen kannst. In der Regel sind hierfür Scrollbars zuständig.
Wenn ich, um einen Navigationspunkt zu erreichen aber scrollen muss, dann ist das ein Hinweis, dass die Auswahl überladen ist.

Du hast weiter ein Designproblem:
Wie weiss ich nun, mit welchem Listenpunkt ein Punkt verbunden ist? Deine Numerierung ist wenig hilfreich.

mfg Beat