Wer hilft mir bei DIV/CSS-Layout weiter?
Max Smily
- css
Hallo Forum,
Ich habe mich an ein reines DIV/CSS-Layout gewagt.
Einen Designentwurf, den ich gerade im klassischen Tabellenlayout fertig gestellt hatte, wollte ich nun als DIV/CSS-Layout umsetzen und stoße dabei auf einige Probleme.
Mein Entwurf funktioniert in Mozilla 1.2.1 so wie gewünscht. Alles Bestens!
Doch in IE 6.0 und in Opera 7.0 gibts Probleme (ältere Browser hab ich nicht getestet).
Es handelt sich um ein zentriertes Layout. Ein Haupt-Div mit fester Breite und Höhe enthält alle weiteren Divs. Hier befindet sich auch das Text-Div für die "Nutzlast" der Seite, in welches die eigentlichen Informationen rein kommen. Wenn dieses Text-Div in der Höhe größer wird, als die Höhenangabe des Haupt-Divs (600px), dann sollen sich das Haupt-Div und das linke graue Div in der Höhe anpassen. Dafür ist das graue Div auf Höhe 100% gestellt und einige andere Divs wurden mit position: relative platziert.
Im Mozilla 1.2.1 wird alles korrekt angezeigt.
Der IE 6.0 treibt jedoch das graue Div nicht auf volle Höhe aus.
Der Opera 7 treibt weder das graue noch das Haupt-Div aus und positioniert obendrein das Text-Div total falsch. Es scheint, als ob Opera 7 gar nichts mit relativ positionierten Divs anfangen kann.
Wer kann mir Optimierungs-Tipps geben. Was sollte ich ändern? Ist meine Herangehensweise an das Thema korrekt?
Vielleicht könnt ihr den Entwurf auch mal mit IE5.5 und auf anderen Plattformen testen.
http://www.tenevista.de/botanico/divtest.html
Zur besseren Übersicht hab ich einige Divs mit Rahmen versehen und einige Title-Attribute mit Kurzbeschreibungen eingefügt.
Max
Hallo
Ein Haupt-Div mit fester Breite und Höhe enthält alle weiteren Divs. Hier befindet sich auch das Text-Div für die "Nutzlast" der Seite, in welches die eigentlichen Informationen rein kommen. Wenn dieses Text-Div in der Höhe größer wird, als die Höhenangabe des Haupt-Divs (600px), dann sollen sich das Haupt-Div und das linke graue Div in der Höhe anpassen. Dafür ist das graue Div auf Höhe 100% gestellt und einige andere Divs wurden mit position: relative platziert.
Wie passt sich das Haupt-Div an das Text-Div an, wenn es absolute Größenangaben hat?
Gruß André