:before / z-index im Internet-Explorer 8

[SteffenR]

Ich möchte über CSS mithilfe von :before bzw :after ein zusätzliches Element (Bild) hinter einem DIV positionieren.
Bis auf den IE8 verstehen dies auch alle Browser. Ich habe schon versucht die Elemente über position: relative / absolute und entsprechende z-indexe anzuordnen aber auch dies brachte keinen Erfolg.

Was macht der IE8 da anders und wie kann man hier gegensteuern ohne gleich Jacascript oder Conditional Comments zu verwenden ?

Beispielhaft ist der Code hier zu sehen:
http://port11.de/files/test/index.html

Vielen Dank für evtl Hilfen,
SteffenR

[ChrisB]

Hi,

Bis auf den IE8 verstehen dies auch alle Browser. Ich habe schon versucht die Elemente über position: relative / absolute und entsprechende z-indexe anzuordnen aber auch dies brachte keinen Erfolg.

#my_div { position:relative; z-index:0; }
#col { position:relative; z-index:-1; }

• damit sieht's bei mir im IE 8 (IETester) so aus wie im Firefox.

wie kann man hier gegensteuern ohne gleich Jacascript oder Conditional Comments zu verwenden ?

Negativen Effekt der genannten Werte kann ich auch im Firefox nicht feststellen; falls er sich in einer komplexeren Umgebung doch einstellen sollte, dann nutze halt CSS-Hacks, um nur im IE die entsprechende Formatierung vorzunehmen.

MfG ChrisB

[SteffenR]

Diese Kombination hatte ich so noch nicht ausprobiert - das sollte so funktionieren - im IE 8 zeigt er mir hier zumindest alles wie gewünscht. Dann sollte es im eigentlichen Layout dann hoffentlich auch funktionieren..

Vielen DANK !!!

Hi,

Bis auf den IE8 verstehen dies auch alle Browser. Ich habe schon versucht die Elemente über position: relative / absolute und entsprechende z-indexe anzuordnen aber auch dies brachte keinen Erfolg.

#my_div { position:relative; z-index:0; }
#col { position:relative; z-index:-1; }

• damit sieht's bei mir im IE 8 (IETester) so aus wie im Firefox.

wie kann man hier gegensteuern ohne gleich Jacascript oder Conditional Comments zu verwenden ?

Negativen Effekt der genannten Werte kann ich auch im Firefox nicht feststellen; falls er sich in einer komplexeren Umgebung doch einstellen sollte, dann nutze halt CSS-Hacks, um nur im IE die entsprechende Formatierung vorzunehmen.

MfG ChrisB

[Matthias Apsel]

Om nah hoo pez nyeetz, SteffenR!

Dann sollte es im eigentlichen Layout dann hoffentlich auch funktionieren..

zu beachten sind ggf. auch die z-indizes der Elternelemente. [[ref:self812;css/eigenschaften/positionierung.htm#z_index@title=selfhtml]]

Matthias