Question

I am making a navigational menu in html and css, but i want the border right of each navigational item to be an image.

I tried

border-right:url(image.jpg);

But this didn’t work.

How do I do it?

Answer 1

You can use a background image and then position the background image to the right of each element. Usually this would go on either the a tag or li. For example:

#primaryNav a:link { 
 background-image: url('image.jpg');
 background-position: right;
 background-repeat: no-repeat;
 display: block; /* make the link background clickable */
}

If you don’t want the border applied to the last (when using background-position: right;) or first (for background-position: left;) element in your menu then try the :last-child and :first-child selectors.

#primaryNav a:last-child {
   background: none;
}