How to make distance between dot and text in a unordered list smaller?
You could try a negative text-indent
on the <li>
:
li {
text-indent: -5px;
}
For example: http://jsfiddle.net/ambiguous/QgNxw/
Browser support might be a bit dodgy (e.g. Opera and WebKit don't render that fiddle the same way). You could also try using the :before
pseudo-element to add your own bullet:
.closer {
list-style-type: none;
}
.closer:before {
content: '•';
margin-right: 3px;
}
For example: http://jsfiddle.net/ambiguous/eXxzH/
But then you'll have trouble with browsers that don't understand :before
; but everyone but IE7 and older understand :before
so that might not be an issue.
If CSS3 is okay, you might be able to do something with the ::marker
pseudo-element.
There isn't that much fine grained control over how the bullets for a list item are rendered.