Listen Punkt formatieren

[DiDiJo]

Hey Leute,

ich einige Überschriften auf meiner Seite wie folgt gestaltet.

<ul class="pfeil"><li>Überschrift</li></ul>

diese Liste kriegt folgende CSS Eigenschaften:

.pfeil    {margin:0;list-style-image:url(../pics/pfeil.gif);}
.pfeil li {color:#272c57;font-weight:bold;}
.pfeil li {#margin-left:40px;}

soweit kein Problem. Wie kann ich aber nun dieses List-Style-Image umpositionieren?

im Firefox ist alles ordentlich aber in alles IEs steht der Bild ganz oben und nicht zentriert. Mit welcher Aufruf kann ich nun das Bild beiospielsweise um 8px nach unten verschieben ?

mfg DiDi

 

[Loomis]

Spar dir das und setzte das Bild als Hintergrund ein. So kannst du das besser positionieren.

 

[DiDiJo]

ok das macht sinn .... ich gebe dann aber dem .pfeil li das hintergrundbild oder ? sonst würde das anführende zeichen nur einmal erscheinen, oder ?!

 

[Maik]

Hi!

Richtig, das voreingestellte Bulletzeichen wird für das ul-Listenelement mittels list-style:none ausgeschaltet, und für die Listeneinträge li das nicht zu wiederholende Hintergrundbild definiert.

Wichtig hierbei: Entsprechend der Bildbreite ist für die Listeneinträge ein linker Innenabstand erforderlich, damit ihr Inhalt nicht das Hintergrundbild überdeckt.

mfg Maik