Helen3061371 Helen3061371 - 1 year ago 73
CSS Question

CSS remove gap between the text and list-style-image

For my

list items I added a picture using

example what I have: JSFiddle

ul {
list-style-image: url('http://placehold.it/50x40');

<li>Coca Cola</li>

I would like my text (e.g. "Coffee") within the
items to touch the pictures - have no gap between the list item image and its description.

Answer Source

You can wrap the contents of each <li> in a <span> and then position that span accordingly:


And then:

li span {
  position: relative;
  left: -7px;


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download