List style image help

Hello friends,
I have a quick question regarding list style images:

Note: There is no problem in Firefox, this is just an IE issue.

I use an image to replace the default list style images at my website (http://www.rhstevenson.com) but in IE when I rollover any link on the page, the image goes away.

Here is my CSS:
#navlist {
padding-left:0px;
margin-left:0px;
margin-bottom: auto;
display: block;
line-height: 17px;
list-style-image: url(Images/dots.jpg);
list-style-position:outside;
}

It's rather difficult to explain, perhaps if you have time you can go to my website (http://www.rhstevenson.com) and take a look, if you're using IE..

Does anyone have an idea why this happens, and if so, how i could fix it?
Thanks in advance,
R

I can't say for sure but it might be because IE is calculating the anchor (text) width over the top of these images. Try removing the width and see if it still occurs?

Great! you fixed my problem, however how do i replace the code i took out:
margin-left:0px;

Now everything works perfectly, except it is aligned off to the right now...

Thank you!


Well i fixed the issue... I guess you're right that something was covering it up, because i simply changed margin-left:0px; to margin-left:10px; And it works now. Anything less than 10px covers up part of the image until around 5px then it goes away entirely. For now i'll just have to deal with the 10px difference...

Thank you very much for all your help!

You could try putting the list-bullets into the actual list items themselves with the anchor text; using JavaScript hovers; repositioning the list itself, or an element containing the list.