Hallo Nils,
Du hast einen "Kunstgriff" verwendet, indem du das rote als body genommen
hast - aber geht das auch, wenn es ein eigenes div ist, u.U. wenn die ganze
Konstuktion in weitere divs verschachtelt ist? Mir ist es jedenfalls nicht
gelungen...
Mir auch nicht, schlimmer noch, wenn man es als div umsetzt, schneidet der
Internet Explorer 6 plötzlich die überstehenden Elemente ab.
Noch ein Kunstgriff: die grünen Sprossen sind nicht per margin zentriert,
sondern dadurch, dass die Breite der Blöcke bekannt ist - clever! Ich
fürchte, eine von absoluten Breiten unabhängige Lösung wird kaum möglich
sein - oder?
Die Breite der grünen Sprossen ist von der Breite des roten Elternelementes
abhängig. Da divs Blockelemente sind und sich hoffentlich über die ganze
Breite spannen muß nur noch der margin dazuaddiert werden und wir haben die
Breite.
Warum schreibst du bei den grünen -25em als Abstand nach rechts?
Wie gesagt, es war eine Quick-and-Dirty-Version. ;-)
Ich würde gerne deine Lösung einsetzen, aber jetzt steck ich in dem Dilemma -
wenn's im IE5 nicht geht, kann ich es praktisch nicht machen.
Ich würde es lassen. Negative Margins sind irgendwo immer ein riskantes Thema
und in lausigen Browsern wie dem IE5 oder schlimmeren Varianten weiß man nie
genau, was die nun daraus machen.
Also eine andere Lösung. Wofür brauchst Du den roten Bereich? Soll da
unbedingt Inhalt rein? Muß der das Elternelement der grünen Sprossen sein?
Ansonsten würde ich etwas tricksen. Um den Effekt zu erreichen würde ich
eine 1 Pixel hohe Linie als Bild erstellen und diese als Hintergrundbilder
zentriert und nur vertikal wiederholend in die Seite einbinden. So erhält
man eine rote Spalte im Hintergrund über die man dann bequem die zentrierten
Sprossen legen kann und muß sich nicht mit irgendeinem Elternelement
rumärgern.
Aber paßt das irgendwie in Deine Seite hinterher?
- Tim
Ich weiß nie, was für eine Signatur ich nehmen sollte.