Mit css eine Onmouseover navigation

[Axel Richter]

Hallo,

ich habe eine Navigation mit Bildern mit Onmouseover effekt wie hier mit dem Hampelmann gemacht: http://www.fractatulum.de/fraccss/sample/hov2format2.htm

hier ist sie: http://www.sirnick.de/sirnick

aber die funktioniert nur in meinem IE 6 in Netscape 7 zum beispiel garnicht.
Warum ?

a.eins {
background-image: url(eins_dn_000.gif);
background-repeat : no-repeat;
width:120px;
height:55px;
}
a:link.eins {
background-image: url(eins_dn_000.gif);
background-repeat : no-repeat;
}
a:visited.eins {
background-image: url(eins_dn_000.gif);
background-repeat : no-repeat;
}
a:hover.eins {
background-image: url(eins_hi_000.gif);
background-repeat : no-repeat;
}

<div style="position:absolute; height:55px; width:120px; left:10px; top:115px;"><a href="#" class="eins"></a></div>

Breitenangaben werden nur bei Blocklevel-Elementen interpretiert. Ein a ist _kein_ Blocklevel-Element, sondern ein Inline-Element. Deshalb ist ein <a></a> genau 0px breit, also nicht zu sehen.
Bei http://www.fractatulum.de/fraccss/sample/hov2format2.htm
wird das durch ein display:block; im Style vom a umgangen. Das ist aber, meiner Meinung nach, nicht ganz sauber, weil das aus dem Inline-Element a kein Blocklevel-Element macht. Besser wäre es die Größe durch eine transparente Grafik zu erzeugen.

<div style="position:absolute; height:55px; width:120px; left:10px; top:115px;"><a href="#" class="eins"><img src="transparent.gif" height="55" width="120" alt="eins"></a></div>

viele Grüße

Axel