Probleme mit z-index
Knusperklumpen
- css
0 Axel Richter0 Stahli
Hi,
ich habe eine Tabelle mit mehreren Zeilen bzw. Spalten.
In einer der Spalte befindet sich Text, der mit einem Tooltip versehen ist. Dieser Tooltip wird mittels CSS-Eigenschaften beim überfahren mit der Maus ein- und ausgeblendet. Das funktioniert soweit auch, nur leider gibt es im Internet-Explorer das Problem, dass der geänderte z-index Wert anscheinend ignoriert wird, daher überlappt der Tooltip nicht den Text der darunterliegenden Spalte sondern beide sind auf gleicher Ebene.
Schaut euch am Besten folgendes Beispiel an:
http://www.knusperklumpen.de/zindex-test.html
Im aktuellen Firefox funktioniert es problemlos, der IE 6 will aber nicht so richtig.
Weiß jemand Rat wie man das auf beiden Browsern hinbekommt?
Danke und mfg
Knusperklumpen
Hallo,
In einer der Spalte befindet sich Text, der mit einem Tooltip versehen ist. Dieser Tooltip wird mittels CSS-Eigenschaften beim überfahren mit der Maus ein- und ausgeblendet. Das funktioniert soweit auch, nur leider gibt es im Internet-Explorer das Problem, dass der geänderte z-index Wert anscheinend ignoriert wird, daher überlappt der Tooltip nicht den Text der darunterliegenden Spalte sondern beide sind auf gleicher Ebene.
Das Problem ist bekannt. Hier http://forum.de.selfhtml.org/archiv/2003/6/t50128/#m274361 trat es bereits einmal auf. Die Lösung damals war, das relativ positionierte Element, an dem sich die absolut positionierten Elemente orientieren, ganz außen herum zu legen. Das geht aber bei einer Tabelle nicht.
Schaut euch am Besten folgendes Beispiel an:
http://www.knusperklumpen.de/zindex-test.html
Du hast da die Verschachtelung
<a><div>Text<span>Text</span></div></a>
Das geht so nicht. Ein A-Element darf keine DIV-Elemente enthalten. Wozu brauchst Du das DIV da überhaupt? Wenn es einen tieferen Sinn hat, dann muss das ein SPAN werden.
Weiß jemand Rat wie man das auf beiden Browsern hinbekommt?
Wenn Dir ein
<td title="Erläuterungstext"><a href="#">Inhalt Spalte 3</td>
nicht genügt, dann wohl nur mit zusätzlichem JavaScript für den IE.
viele Grüße
Axel
Ich hatte das Problem auch mal, der IE kommt irgendwie nicht mit der CSS-Eigenschaft display klar. Ich hab damals meine Infobox zu einer div gemacht und mit position:absolute versehen und positioniert. Dann kann man visibility:visible und visibility:hidden verwenden und es ging dann auch wieder mit dem z-index. Schön ist das jedoch auch nicht.