Für meine ul
Listenelemente habe ich ein Bild mit list-style-image
-Eigenschaft hinzugefügt.
Beispiel, was ich habe: JSFiddle
Ich möchte, dass mein Text ( z. B. "Kaffee") innerhalb der Elemente li
die Bilder berührt - habe keine Lücke zwischen dem Bild der Liste und seiner Beschreibung.
Sie können den Inhalt jedes <li>
in ein <span>
umbrechen und dann den Bereich entsprechend positionieren:
Und dann:
%Vor% Eine Lösung besteht darin, den Listenstil zu entfernen und das Bild vor dem Element li
über die Pseudoklasse :before
Es scheint, dass Sie den Abstand zwischen dem list-style-image (oder bullet) und dem li-Inhalt nicht direkt steuern können.
Um es zu ermöglichen, können Sie das Bild als Hintergrund verwenden
%Vor%Sie können sich auch diese Antwort hier ansehen
>Sie müssen einen CSS-Trick machen, um das zu bekommen.
Verwenden Sie
%Vor%statt
%Vor%Eigenschaft dafür siehe fiddle link
Ich glaube nicht, dass Sie das mit List-style-image machen können. Sie müssen stattdessen einen falschen Listenstil erstellen. Etwas wie das:
%Vor%Demo hier: Ссылка
Obwohl Sie eine Antwort akzeptiert haben, finde ich, dass sie viel komplizierter ist, als es sein muss.
Angenommen, Sie interessieren sich nicht für IE8 oder niedriger, dann schlage ich vor: