CSS list-style-image rechts vom Text positionieren

[orschiro]

Hallo Leute,

ich habe die Listeneinträge einer Liste rechtsbündig formatiert. Wenn ich nun allerdings ein list-style-image vergebe, wird dies standardmäßig links des Listeneintrages, also quasi so angezeigt:

(Bildchen) Listeneitrag Nummer1
(Bildchen) Listeneitrag Nummer2​

Mein Wunsch wäre nun Folgender:

Listeneitrag Nummer1 (Bildchen)
Listeneitrag Nummer2 (Bildchen)​

Lässt sich das mit CSS realisieren?

Ich bedanke mich für eure Antworten.

 

[Raechaer]

Vielleicht geht's auch einfacher, aber eine Alternative wäre folgendes: Du verwendest überhaupt kein list-style-image sondern nimmst das Bild als Hintergrund für das <li> Element. Dieses Hintergrundbild musst du dann nur am rechten Rand positionieren und die Wiederholungen ausschalten. Wenn du den Text des <li> dann mittels padding noch ein Stückchen nach links verschiebst solltest du das gewünschte Ergebnis haben.

 

[orschiro]

Hallo Raechaer,

danke für deine Antwort. Dass es auch mit einem Background geht, war mir klar, mir erschien es nur mehr als logisch, dass ein list-style-image von den CSS Eigenschaften her auch rechts vom Text stehen kann.

Nunja dem scheint ja wohl nicht so.

 

[Darii]

Naja, ein Listenpunkt steht nunmal immer* links von dem Listenelement. Deswegen macht es keinen Sinn sowas per CSS anpassen zu können. Wenn du das anders haben möchtest, dass möchtest du keinen Listenpunkt haben sondern irgendwas anderes.

* Naja nicht immer, im Arabischen z.B. nicht und mit direction: rtl; kriegst du ihn dann auch nach rechts, allerdings hat evtl. irgendwelche Nebeneffekte, da das nicht dazu gedacht ist, Listenpunkte zu verrücken.