Layouting mit CSS!? (für komplizierte Layouts?)

[renew]

Ich bin dabei gerade eine Website zu erstellen die ein recht kompliziertes Layout verwendet.

Jetzt würde ich es natürlich gerne gleich "richtig" machen und die einzelnen Bilder etc. in DIVs packen und so das gesammte Layout per CSS steuern.

Jedoch ist dies nicht so einfach, da das Layout eben ziemlich verschachtelt ist.

Es wäre kein Problem, wenn alles absolut positionbar wäre, was jedoch nicht sinnvoll ist, da die Site sowohl in der Höhe als auch in der Breite in der Mitte erscheinend soll.
Der einzige Ausweg, der mir derzeit einfällt wäre nur alles wieder in ein eine Tabelle zu packen und diese dann genau in die Mitte zu positionieren - was allerdings nicht sehr elegant ist.

Im Anhang findet ihr noch das Layout der einzelnen Divs.

Dank euch schon einmal herzlich, lg renew

[jak]

Es ist mit CSS möglich, aber mühsam. Vermutlich ginge es über ein div, das vier unter divs hat (für 1-6, 7, 8 und ab 9), die sich wieder unterteilen. In den unterteilten divs müsstest du dich mit "float" spielen.
Ich würd' eine Tabelle nehmen.

jak

[Sesa_Mina]

Es ist mit einfachen mitteln möglich, eine seite nur mit css zu zentrieren.

#Main {
background-color: transparent;
padding: 0px;
border: 1px solid #000000;
margin: -301px 0 0 -497px;
position:absolute;
top: 50%;
left: 50%;
width: 992px;
height: 600px;
overflow: hidden;
}

und im body n <div id="Main">

[renew]

ja, schon klar, dass man mit CSS eine Seite zentrieren kann. Es reicht ja schon ein margin-left:auto; margin-right:auto

Jedoch muss ich in dieses "über-div" dann alles relativ positionieren, bzw. eben mit float und clear die einzelnen Elemente verschachteln.
Und genau das ist mein Problem.

@jak
danke, werde mich einmal mit dem Vorschlag der Aufteilung ein wenig spielen - vielleicht bring ich ja etwas zusammen. Wobei sich noch eine kleine Änderung des Layouts ergeben hat (mein Fehler, da meine Menüleiste unterteilt wäre.... )

[Sesa_Mina]

Wenn du eine fixe Breite voraussetzt kannst in dem über-div auch alles absolut positionieren.

[snowman]

Du versuchst ein klassiches Tabellenlayout (viele Slices; sind eigentlich out) in ein CSS-Layout zu zwängen. Wenn du das wirklich machen willst, dann fange so an, wie jak es vorgeschlagen hat.

gruss,
snowman

[renew]

Original geschrieben von snowman
Du versuchst ein klassiches Tabellenlayout (viele Slices; sind eigentlich out) in ein CSS-Layout zu zwängen. Wenn du das wirklich machen willst, dann fange so an, wie jak es vorgeschlagen hat.

gruss,
snowman

jop, das habe ich vorhin gemacht. Nur irgendwie ist das zum "Auszucken".
Habe mir nur einmal den obersten Teil genommen und probiert, diesen korrekt anzuordnen.
Jedoch schon beim 2 "logischen" DIV ordnet werden 2 Elemente, die nebeneinander gehören, untereinander angeordnet, sobald ich die korrekte Größe angebe.
Lasse ich "100%" funktioniert es, jedoch ist der Block natürlich zu breit.

@sesa_mina
ganz versteh ich das jetzt nicht was du meinst.
Wenn ich eine fixe Breite für das über-div fest setze (welches ich in jedem Fall brauche, da ich mit diesem die komplette Seite auf dem Bildschirm zentriere), kann ich innerhalb von diesem alles absolut positionieren? (war das deine Aussage?)
Denn genau so funktionierts ja nicht - denn sobald ich absolut positioniere, positioniere ich die einzelnen Blöcke absolut in der Seite - und nicht vom vorherigen DIV, in welches es eingebettet ist.

PS: ich werd mich noch ein wenig spielen, jedoch fürchte ich, dass ich um die gute alte Tabelle nicht herum komme.

[Sesa_Mina]

kuxt du hier wie es geht:

http://www.dream.at/temp/testy
http://www.dream.at/temp/testy/theme...ult/styles.css

[ruffy_mike]

Die meisten Browser haben noch deutliche Schwierigkeiten mit komplexen CSS-Formatierungen (va. mit position- overflow- visibility-Attributen u. ä.). Also auf jeden Fall mit unterschiedl. Browsern testen, beim Vergleich IE vs. Firefox hatte ich oft zwei komplett unterschiedl. Layouts!

[renew]

Herzlichen Dank!

Das scheint ja wirklich absolut positioniert zu funktionieren - genial.

Nochmals danke, lg renew

PS: ist das deine Seite?