Info Table mit CSS ein und ausblenden

[Pete]

Hallo,
habe folgendes Problem.

Ich möchte ein Bild einbinden (so ein info i) und wenn man mit dem Curser drüber geht zeigt sich an definierter Stelle irgendwo ein InfoTable mit Text.

Ich hab es auch schon so wie es funktionieren soll aber nur der IE weigert sich wehement das ganze anzuzeigen. Firefox und Opera zeigen alles an

Kann mir jemand helfen und sagen warum der IE so rumzickt?
Kennt jemand eine Lösung, wie er es schluckt?

(Bitte keine JavaScript alternativen, die habe ich schon ausprobiert dürfen/sollen aber nicht ausgeführt werden.)

<style type="text/css">  
<!--  
img {  
border:none;  
}  
  
#box div{display:none;}  
  
#box:hover div{  
display:table;  
height: 50px;  
width:100px;  
position:absolute;  
top:200px;  
left:200px;  
font-family: Verdana, Arial, Helvetica, sans-serif;  
font-size: 10px;  
padding: 5px;  
color: #000000;  
border:1px;  
border-style: solid;  
border-color:#000000;  
background-color:#b4b4b4;  
filter:alpha(opacity=80);  
-moz-opacity:0.8;  
-khtml-opacity: 0.8;  
opacity: 0.8;  
  
}  
-->  
</style>

  
<table>  
	<a id="box" href=""><img src="info.gif"  alt="info"><div>HIER kommt der Info Text rein</div></a>  
</table>	  

[Gunnar Bittersmann]

@@Pete:

nuqneH

Kann mir jemand helfen und sagen warum der IE so rumzickt?

Weil er mit 'display: table' nichts anfangen kann.

Kennt jemand eine Lösung, wie er es schluckt?

<style type="text/css">
<!--

Die HTML-Auskommentierung von CSS-Code ist völlig unnötig.

<table>
<a id="box" href=""><img src="info.gif"  alt="info"><div>HIER kommt der Info Text rein</div></a>
</table>

Invalides HTML:

(1) 'table' darf nicht 'a' als Kindelement haben, sondern:
<!ELEMENT TABLE - - (CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)> [HTML401 §11.2.1]

Das 'table'-Element ist hier auch fehl am Platze; hier gibt es keine Tabelle.

(2) 'a' darf nicht 'div' (o.a. Blockelemente) als Kindlement haben.

Das 'a'-Element ist hier auch fehl am Platze; es ist kein Link.

Vielleicht schaust du dir mal Ingo Turskis Infobox an.

Qapla'

[Pete]

@@Pete:

nuqneH

Kann mir jemand helfen und sagen warum der IE so rumzickt?

Weil er mit 'display: table' nichts anfangen kann.

Kennt jemand eine Lösung, wie er es schluckt?

<style type="text/css">
<!--

Die HTML-Auskommentierung von CSS-Code ist völlig unnötig.

<table>
<a id="box" href=""><img src="info.gif"  alt="info"><div>HIER kommt der Info Text rein</div></a>
</table>

Invalides HTML:

(1) 'table' darf nicht 'a' als Kindelement haben, sondern:
<!ELEMENT TABLE - - (CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)> [HTML401 §11.2.1]

Das 'table'-Element ist hier auch fehl am Platze; hier gibt es keine Tabelle.

(2) 'a' darf nicht 'div' (o.a. Blockelemente) als Kindlement haben.

Das 'a'-Element ist hier auch fehl am Platze; es ist kein Link.

Vielleicht schaust du dir mal Ingo Turskis Infobox an.

Qapla'

Danke

<a> ist jetzt <span> und es funktioniert :)
Hatte vorher in einem Forum gelesen, dass es nur als Link akzeptiert würde...tja soviel dazu.

<table> ist somit auch überflüssig war vorher nötig (warum auch immer, ohne wurde nichts angezeigt).
Egal, jedenfalls funktionierts jetzt und ich bin glücklich.
Vielen Dank!