Transparente Box und Schrift

Was meinst du? Wo gibt es Bockelemente innerhalb eines Inline-Elements - etwa innnerhalb eines Links? Auf ganu dieser Seite gibts doch gar keine Links. Hat das denn direkt mit meinem Problem zu tun. Ich meine, im Firefox klappt alles wunderbar. Es ist mal wieder nur sch*** Internet Explorer der rumzickt.
 
Was meinst du? Wo gibt es Bockelemente innerhalb eines Inline-Elements - etwa innnerhalb eines Links? Auf ganu dieser Seite gibts doch gar keine Links.
Tatsächlich? :suspekt:

Kleinen Auszug aus "deinem" Quellcode gefällig?

Code:
<a href="#" class="tooltip">
<div class="shadow5"><img style="z-index: 4; position: relative" src="./images/Spielerfotos/Fadda-new.jpg" style="border: 1px solid #3a3a3a" /><span><span><center><img border="0" width="50" src="templates/corona03/images/chromeg.png" height="69" style="behavior: url('./modules/mod_fisheye_menu_camp26/fisheye_menu/png.htc');" /></center>
<div style="font-family: Arial,JanicesHand,Lucida Calligraphy,Times New Roman; color: #ffffff; font-size: small">
<table>
<tbody>
<tr>
<td>Name: Ronny Behrendt</td>
<td></td>
</tr>
<tr>
<td>Geburtstag: 26. April 1967</td>
<td></td>
</tr>
<tr>

<td>Beruf: Maurer</td>
<td></td>
</tr>
<tr>
<td>Rückennummer: 9</td>
<td></td>
</tr>
<tr>
<td>Position: Zentrales Mittelfeld</td>
<td></td>
</tr>
<tr>
<td>Fan von: Hamburger SV</td>

<td></td>
</tr>
</tbody>
</table>
</div>
</span></span></a>

Im href-Attribut des a-Elements ist zwar kein Verweisziel genannt, dennoch handelt es sich hierbei um ein Inline-Element.

mfg Maik
 
Wie ich das mit dem <a href="#" ...> korrigieren soll, weis ich nicht, weil du solltest wissen ich arbeite mit joomla und dieser tooltip gehört zu einem plugin welches per {tooltip} implementiert wird. Deshalb steht im Joomla-Beitrag mit dem untenstehenden html-Code auch nur {tooltip}, was im Quelltext allerdings als <a href="#" ...> erscheint.
Aber hat denn das nun wirklich unbedingt mit meinem Schichtposition-Problem zu tun?
 
Schon möglich, nur ist das auch keine Garantie dass mein z-index dadurch gelöst wird.
Hast du vielleicht noch ne Idee? Falls nich muss ich mal diese DebugBar für den IE installieren und schauen was sich dort machen lässt.
Was mir per Firebug auffiel, ist das bei MouseOver über ein Bild was von "element.style {z-index: 2}. Scheint also irgendwie per php hardcodiert zu sein. Dies bion ich zwar per !important umgangen, sodass laut Firebug diejenige Schichtposition maßgebend ist die in der class DIV.shadow5:hover IMG steht. Kalppt im IE aber immer noch nicht. Box ist nach wie vor unterm Bild.
 
Habs hinbekommen. In der CSS vom tooltip habs noch weitere classes die direkt für den tooltip zuständig waren. Ich hab dann einfach mal bei allen die Schichtposition hinzugefügt wie bei .tooltip span span und sicherheitshabler noch n !important rangehängt. Jetzt klappts auch im IE.
 
So funktioniert es im IE, ganz ohne die unzähligen "z-index:5 !important"-Deklarationen, sowie dem Anhängen der !important-Regel bei den Schichtpositionsangaben der Grafiken ;-)
HTML:
<tr>
<td><a href="#" class="tooltip  zIndex_5">
<div class="shadow5"><img src="./images/Spielerfotos/Fadda-new.jpg" style="border: 1px solid #3a3a3a" />
...
</div>
</a>
</td>
<td><a href="#" class="tooltip zIndex_4">
<div class="shadow5"><img src="./images/Spielerfotos/Horschte-new.jpg" style="border: 1px solid #3a3a3a" />
...
</div>
</a>
</td>
<td><a href="#" class="tooltip zIndex_3">
<div class="shadow5"><img src="./images/Spielerfotos/Detti-new.jpg" style="border: 1px solid #3a3a3a" />
...
</div>
</a>
</td>
<td><a href="#" class="tooltip zIndex_2">
<div class="shadow5"><img src="./images/Spielerfotos/Muelli-new.jpg" style="border: 1px solid #3a3a3a" />
...
</div>
</a>
</td>
</tr>
CSS:
.tooltip { position: relative; }
.zIndex_5 { z-index: 5; }
.zIndex_4 { z-index: 4; }
.zIndex_3 { z-index: 3; }
.zIndex_2 { z-index: 2; }

mfg Maik
 
Zurück