[css]z-index-Probleme und -Verwirrungen

[webmichl]

Servus!

Ich bin dabei, eine tabellenähnliche Struktur mittels DIVs zu konstruieren, was auch prinzipiell keine Probleme macht. In Abb. 1 sieht man den prinzipiellen Aufbau: ein "Zeile"-DIV ( "grau" ) mit den css-Attributen "clear: both;position: relative;" beinhaltet die beiden Content-DIVs "rot" und "blau", die jeweils "float: left" als css-Attribut beinhalten.

Nun will ich aus dem Text, der in diesen beiden Content-DIVs steht, mittels JS-Links Infolayer ein- und wieder ausblenden. Das läuft über eine visibility-Weiche und funktioniert auch so wie's soll.

Diese Infolayer haben folgende css-Attribute: "position: absolute; top: -50px; left: 50px; width: 200px; height: auto;z-index: 500;".

Das mit dem z-index funktioniert im Firefox auch so wie gedacht: er liegt "ganz oben" und verdeckt ( temporär ) die Folgezeilen ( Abb. 2a ).

Anders der IE: da liegen die Folgezeilen über dem Infolayer, was nicht ganz der Sinn der Sache ist ( Abb 2b ). Anscheinend gilt hier der z-index nur innerhalb des aktuellen "Zeilen"-DIVs - oder er wird komplett ignoriert.


Hat jemand einen Tip, wie ich dem IE diese Flausen austreiben könnte?

[webmichl]

Zitat von ingozen

...
prinzipiell erstmal die Frage: Warum keine Tabelle?

weil 1. der Aufbau nicht so gleichmäßig wird wie im Beispiel und es mir 2. bei Tabellen zu lange dauert, bis der Inhalt angezeigt wird ( die Seiten können recht lang werden ).

Zitat von ingozen

Wenn du div´s notierst und keinen expliziten Z-Index vergibst, steigt die Wertigkeit mit der Abfolge.
D.H., dass der IE das hier mal ausnahmsweise richtig macht.
Abhilfe würde es schaffen, wenn du von oben nach unten ausdrücklich den Stapelwert vergibst.

Das hab ich gerade mal ausprobiert: den Zeilen einen aufsteigenden z-index (1,2,3... ) verpasst - der Infolayer ( z-index: 500 ) liegt immer noch drunter...

[xynn]

Der IE6 hat die merkwürdige angewohnheit bei relativ positionierten Elementen neu mit Index-zählen anzufangen, was mich auch schon einige Male in Verzweiflung getrieben hat. Ich habe gerade keinen Link parat, aber wenn du in die richtung mal googelst findest du sicher was. Viel Glück

[webmichl]

Ich hab inzwischen eine - zugegebenerweise etwas seltsame - Lösung gefunden: ich habe die "top"-Angabe bei der Positionierung weggelassen - dann funktioniert's auch beim IE...