I am trying to make a faux bullet for my page menu items using a background image. The image is showing in the background of the menu item and then REPEATS right at the beginning of the the list item, like there are two layers happening.

this is my code. adapted from juggledad's cheat sheet. My site is in maintenance mode, so you will not be able to view it.


/* ================================================ */
/* Page Menu item */
/* ================================================ */
ul.rMenu li a:link,
ul.rMenu li a:hover,
ul.rMenu li a:active,
ul.rMenu li a:visited,
ul.rMenu li {
background: url('http://www.terralingua.org/wp-content/themes/atahualpa/images/bullets/bacata.gif') !important;
background-repeat: no-repeat !important;
letter-spacing: 0.3em !important;
padding-left: 25px;
padding-right: 25px;
}

i have completely searched the forums, and have found no answer, though some threads aluded to the image overlap, there were no answers. At this point, i will have to rebuild the nav from scratch as a simple table inserted in %bar2, with a fresh CSS insert. In the interum, if anyone has an idea, please let me know.

I am using, Atahualpa 3.5.3.

still no answers or response? One would think this is a relatively simple problem.

I have attatched a detail image of the nav bar in question, maybe this will jig a solution??

solved!
background image should go under simply ul.rMenu li without the whole a:link deal after it.