Axel Richter: Fehlerhaftes hovern unter IE ?

Beitrag lesen

Hallo,

http://www.ars-communicandi.de/samples/x02_t/x02_p5010p.html

Hier wiederholt sich links die Navigation (eben kleiner) und rechts - gefloatet - der Inhalts-Container. Wenn ich nun hier - mit dem IE -die Navigation bediene, so hovert es nur beim erstem Mal, wenn ich mehrfach darübergehe, funktiniert nur noch der Hover beim letzten Element (Motiv9), bei allen anderen Browsern funktioniert es.

Siehst Du durch den CSS-Wust da wirklich noch durch? Ich würde nicht alles in eine CSS-Ressource packen.

Zum Problem:
Der IE hat öfters Probleme mit dem aktivieren von [element:hover element] - Selektoren. Den gängigen Trigger:

a.motivkl:hover  { border:          none; } /* soll IE-BUG verhindern laut http://www.xs4all.nl/~ppk/css2tests/ie6/purecsspopups.html   */

das heißt, mache irgendwas bei element:hover, damit element:hover element greift, hast Du ja schon implementiert. Allerdings scheint das hier nicht zu reichen.

Workaround:

a.motivkl span {
                 display:         none;
                 color:           #ddd;
                 font-size:       0.8em;
                 font-weight:     bold;
                 width:           122px;
                 text-align:      center;
                 background-color:#003;
                 z-index:         1;
}

a.motivkl:hover span    {
                 display:         block;
                 position:        absolute;
                 top:             10px;
                 left:            8px;
}

Also position, top und left erst bei :hover setzen. Komischerweise machst Du das ja bei a.motiv span und a.motiv:hover span, also beim großen Motiv auch so.

viele Grüße

Axel