Horizontal navigation equally spaced

Hi

CSS newiebish here.

I have a site that use css horizontal navigation that works OK but the client wants more elements in the navigation. His preferred option is to have the navigation over 2 levels, but when I do this the elements are not equally spaced, but varied on their text length and looks odd.

SO the question is - as I am using a background image to colour the element - can I easily get that to a standard width? I have tried using

div #nav_top ul li {
width: 140px;
color: #000000;
}

in conjunction with

#nav_top a {
background-image: url(Web Site Images/but_inact.jpg);
background-repeat: no-repeat;
background-position: 0% 50%;
background-color: #599D7E;
padding: 4px 50px 4px 25px;
border-right: 1px solid #000000;
border-left: 1px solid #666666;
border-bottom: 1px solid #000000;
}

but I am getting a lot of background space showing through. I am sure it is the padding but I am well confused. Any help really appreciated.

And, anyone any better ideas as even if I get his to work I am really unconvinced its the best way forward.

Thanks in advance

A

 

Bump

No ideas for assistance anyone?

Really stuck here ...

 

use display:block, in your "#nav_top a {", and remove padding, that will help.....

 

Thanks matey - that with an additional width in the same block has worked a treat. Still think the client is wrong but he's paying the bills.

Thanks again