navigation menu - auto width

[liorry]

Hello!
I'm stuck on something for quite some time now.
I'm trying to make a navigation bar with a specific design but I want it to auto fit to every width of text I use.

(see image)

Tried everything!
the wrapper holds the right side of the image, the ul holds the left one and every a:link li {} holds the background along with the right border... nothing worked....

what i want to achieve is each <li> has the the right border and it is clickable as a link no matter where you hover it (of course inside the borders of it's <li> (need this so I can add a bottom-border later on hover)

would love if someone could help me in coding this navigation bar as this is my first time...

Thank you!

[liorry]

Could someone please at least point me to a tutorial? I've searched all over google and used "inspect element" (firebug) on similar examples but none seemed to work for me...

[claytonseo]

make a div, with a background image of the your pick, cut a part out of the image, size height(as high as your image) width(1px) then repeat it in your div.

give the <li> a border right with an image background, that will obv be the gray image.