What I'm Doing...

Powered by Twitter Tools

:hover und der IE6…

Welcher Webdesigner kennt das Problem nicht… man codet vor sich hin, alles klappt wie es soll und dann – öffnet man IE6 und sieht etwas ganz anderes als man geschrieben hat…

So ging es mir letzte Woche mit meiner Page(Navigation). Alles ging ja, außer dem Hover-Effekt (meine Navi sind transparente gifs mit Background, und bei hover über die gifs sollte der Background wechseln – was aber nicht ging)

Nach langer google-Bemühung fand ich heraus, dass IE6 nur bei a-Tags :hover in css akzeptiert, ich hatte aber img:hover verwendet. Also mussten Korrekturen her…

Die Klassen für die Backgrounds waren schnell von <img class[...] auf <a class[...] gewechselt. Im IE6 ging dann auch alles, in IE7 auch – aber in Opera und FF nicht… *GNA* Die beiden standardkonform(er)en Browser zeigten den Hintergrund nur in einer kleinen Zeile an, die gesamte gif-Höhe wurde nicht genutzt. Also wieder ein Bugfix:

Die LineHeight der Links wurde erhöht, display wurde auf block gestellt, die Zeilenumbrüche hinter den Links verschwand. Außerdem mussten die BGs korrekt positioniert (top left) werden, sonst war alles leicht nach unten verschoben…

Eklige Sache, aber meine Page geht jetzt in IE6, 7, FF und Opera fehlerfrei (ok, nicht ganz, ich hab noch n float-Problem, da der IE6 anscheinend auch kein clear: both nimmt… aber das is egal und fällt hoffentlich kaum auf… wer den Fehler findet, darf ihn melden und anschließend behalten)

Kommentieren