Text per CSS/Hover anzeigen klappt nicht im IE

[Florian]

Ich habe ein Menü und möchte, dass beim Darüberfahren mit der Maus an anderer Stelle ein Erklärungstext angezeigt wird. So wie man es bei http://www.meyerweb.com/eric/css/edge/popups/demo.html sieht.

Im Fx klappt das auch problemlos, nur mit dem IE nicht. Jetzt würde ich sagen, der IE kanns halt nicht. Aber obiges Beispiel zeigt er problemlos an, nur meine Implementierung nicht.

Das Menü sieht so aus:

<div id="menu">
<a href="about.html">About<span>All about the company</span></a>
<a href="products.html">Products<span>All about the company</span></a>
<a href="contact.html">Contact<span>All about the company</span></a>
<a href="order.html">Order<span>All about the company</span></a>
</div>

Das zugehörige CSS so:

div#menu a {
 display:block;
 background-color:blue;
 color:white;
 font-size:110%;
 margin-bottom:1px;}

div#menu a:hover {
 background-color:grey;
 text-decoration:none;}

div#menu a span {
 display:none;}

div#menu a:hover span {
 display:block;
 position:absolute;
 left:0%;
 top:200%;
 color:black;}

Kann mir jemand sagen, was dem IE daran nicht schmeckt? Da ich absolut keinen Unterschied zu dem Beispiel von Eric Meyer entdecken konnte, verzweifel ich hier langsam...