Question

I’m styling a list and need to set the margins precisely for it to look nice. But I’m using list-style-none and a background-image for each <li> element and it seems to make the margin property totally useless Oo

Well, nothing else to say, here is an exemple: http://symael.servhome.org/buglist.html

The problem is obvious: the padding and margin are the same for every <ul> on the page but in the “tree” div there is style for the <li> elements. It seems to activate a default margin or somewhat…

Anybody knows how to solve this problem ? The aim is to have the “+” or “-” below the folder at the top… Yes, it’s as simple as that :p

Answer 1

This has nothing to do with the margin. The padding of the lis are pushing its children further to the right. You should decrease the padding:

#tree li {
    padding-left: 18px;
}
#tree li a {
    padding-left: 20px;
}