Question

I’m trying to make a menu for a web page and I’m inserting images as menu separators.
maybe this is a little stupid question but I’m trying to remove the first image of my menu
this is my code:

.menu ul li {
    background: url(separator.png) no-repeat left;
    display: inline;
    float: left;
    height:  50px;
    line-height: 50px;
    margin: 0;
    width: 155px;

and tried this to remove the first separator:

   .menu a.first {
         background-image: none;
    }

I tried to do what that’s in this pages:
http://jsfiddle.net/Jaybles/uJdhH/1/
http://www.e-blueprint.co.uk/2011/how-to-use-an-image-as-a-menu-separator/

but it don’t work

Answer 1

because your background is on the li tag and your .first class is on an anchor tag you are removing what ever background the anchor holds not the list item.

change to :

.menu li.first {
         background-image: none;
    }