[Lili0312]

So, nach langer langer Zeit melde ich mich auch einmal wieder und das gleich mit einem riesengroßen Problem.

Ein Freund bat mich folgendes Layout (siehe Bildanhang) tabellenfrei zu erstellen.

Nun sitze ich schon seit einer Woche hierdran und verzweifel an den floats und Positionierungen. Vor Wut habe ich schon fast die Tastatur aus dem Fenster geworfen.

#header {
width: 970px;
height: 209px;
}

#navi {
width: 140px;
height: auto;
}

#ct_left {
width: 400px;
height: 300px;
}

#ct_right {
width: 410px;
height: 300px;

#footer {
width:970px;
height:100px;
}

Die ganzen floats habe ich weggelassen, weil sie eh immer das ganze Layout zerschossen haben.

Zwischen #header und dem Bereich von #navi, #ct_left und #ct_right soll ein Abstand von 10px. Muss ich diese Bereiche dafür nochmals in einen Container packen? Denn wenn ich einfach margin-top: 10px bei allen eingegeben habe, hat das nicht funktioniert.

Ebenfalls sollen zwischen #navi, #ct_left und #ct_right jeweils 10px Abstand sein, daher auch die festgelegten Breiten.

Der Clou kommt jetzt, denn das war das eigentlich Problem. Der Container #navi soll immer so groß werden, wie die Anzahl von #ct_left und #ct_ right ist.

Das ganze mit einer Tabelle zu layouten war ganz einfach, aber ich glaube dies wird eine harte Nuss.

Könnte mir jemand dabei vielleicht helfen?

LG
Lili0312

P.S.
Hier ist der Entwurf.

[RottenRoller]

guck mal hier °°

YAML Builder | A tool for visual development of YAML based CSS layouts

[Lili0312]

Dieses Tool ist ja der absolute Oberhammer.

Danke sehr. Nun steht der Lösung wohl nichts mehr im Wege.

Greetz
Lili0312