Navigation mit Bildern, Mouseover

[wlive]

Hallo Leute,

ich hoffe hier kann mir jemand helfen.

Ich baue eine Vertikale Navigation(5 Menüpunkte) mit Bildern. Alle 10 Bilder sind gleich groß. Jeder Menüpunkt umfasst 2 Bilder. Für Normale Linkansicht und hover. Jeden Menüpunkt soll in einem separaten div-tag erscheinen. Liste geht es bestimmt auch, habe es aber noch nicht probiert.

Wie soll ich es anstellen?

<div id="punkt1">
<a href="../seite/index.html"><img src="../images/grafik1.gif" alt="" /></a>
</div>

...und css

#punkt1 a{
background:url(../images/grafik1.gif);
background-repeat: no-repeat;
background-position: bottom left;
}
#punkt1 a:hover{
background:url(../images/grafik1_over.gif);
background-repeat: no-repeat;
background-position: bottom left;
}

Jetzt habe ich aber das Problem im IE. Der Menüpunkt wird zweimal überlappend angezeigt, mit einem Höhenunterschied von ca. 3-4px. Wahrscheinlich ist die erste Grafik die, die ich via div als Link einfüge und die zweite via css. Es ist nicht die a:hover Grafik.

Was mache ich falsch? Bitte um Rat