Bild bei Hover und mehr

So, da kommen die Probleme wieder. Zum einen hätte ich gerne, dass über einem Link ein Bild erscheint, wenn ich mit der Maus über ihn fahre, zum anderen wüsste ich gerne, was an meinem Code falsch ist, dass er von Safari und IE nicht wie im FF dargestellt wird (safari: links untereinander; ie: links wie ne treppe nach unten).

http://sucker.sheep24.de/work/rar/#

Wäre für ein paar Tips dankbar

<style type="text/css">

#navigation li a:hover, #navigation li a:active{

  padding: 6.5em 0 0 0;

	border-top: 0.5em solid #015be3;

	background-image: url(bild.jpg);

}

</style>

Das Bild so wählen, das jeweils "unter" dem Rand nichts ist (0,5em) und "hinter" der Schrift nichts ist.

Das is ja ne geile Idee, danke

Original von user-148tian
Das is ja ne geile Idee, danke

So wäre für jeden Link aber das gleiche Bild, du müsstest für "individuelle" Bilder jedem <li>-Tag evtl. eine Klasse/ID zuweisen und einzelne Hintergrundbilder vergeben.

jau, das wäre mir dann zum glück auch wieder eingefallen

€: Die Lösung für das IE und Safari Problem:

Man sollte grundsätzlich die "äußeren" Elemente floaten, in deinem Fall also die Listeneinträge (LI-Elemente) und nicht die Links.

Original von user-148tian€: Die Lösung für das IE und Safari Problem:

Man sollte grundsätzlich die "äußeren" Elemente floaten, in deinem Fall also die Listeneinträge (LI-Elemente) und nicht die Links.

... und wieder was gelernt