Problem mit Hintergrund von Link

[Anna]

Hallo,

ich möchte, dass vor jedem meiner Links ein kleiner Pfeil steht. Also habe ich diesen Pfeil als Hintergrundbild ausgewählt und die Schrifft ein wenig nach rechts verschoben, damit das Bild auch wirklich vor dem Link steht. Damit das Bildchen in der vertikal in der Mitte steht, habe ich die background-position auf center left gesetllt.

Das Ganze sieht so aus:

a
{
    text-decoration: none;
    color: white;
    background: url(images/pfeil.gif);
    padding-left: 15px;
    background-position: center left;
}

Klappt auch beim Firefox wunderbar. Sobald beim Internet Explorer allerdings nun die Schrift etwas vergrößert wird und ein langer Link zweispaltig wird, wird plötzlich das Bild nicht mehr in der vertikalen Mitte der ersten Zeile, sondern in der vertikalen Mitte beider Zeilen angezeigt. Es steht dann also nicht mehr vor der ersten Zeile des Links, sondern irgendwo zwischen den zeilen. Beim Firefox dagegen bleibt alles so, wie ich es haben will.

Hat jemand eine Idee, wie ich das problem lösen kann?

"background-position: top left" habe ich nicht gewählt, weil dann das Bild noch höher als die Schrift angezeigt wird, was nicht aussieht.

Danke für Ratschläge!

[Andy]

Hallo Anna,

hier behandelt der IE den Link wie ein Blockelement.
Probier doch mal die Hintergrund-Position mit em auszurichten:

body {
 line-height: 150%;
}
a {
 text-decoration: none;
 background: url(images/pfeil.gif) no-repeat 0 .15em;
 padding-left: 15px;
}

Evtl.mußt du noch etwas an den em schleifen!

Gruß Andy