IE support for li bullet images?

[fasterthanlight™]

Hey hey! quick, simple question...

I've been googling for a while now but to no avail..

I've got a site where I have custom list item bullet images, and it works on every browser except some random version of IE (I don't know which version yet, the client and my boss's boss still need to get back at me)

What it does or doesn't do has yet to be determined by me, but I was just wondering if any of you guys have experienced troubles with this, specifically alignment problems and sometimes 3/4 of the bullet images just don't show, however the first image almost always shows...



.additionalChunk .additionalList
{
padding: 0px 0px 0px 20px;
margin: 0px;
}

.additionalChunk .additionalList li
{
margin: 0px;
padding: 0px;
list-style-image: url(/images/sidebarListBullet.gif);
}

.additionalChunk .additionalList li a
{
display: block;
margin: 0px;
padding: 3px;
}

[kBisk]

You may have better luck using the bullet image as a background on the list items. Something along the lines of

.additionalChunk .additionalList li { background:url(/images/sidebarListBullet.gif) left middle no-repeat; }
and then use padding-left to move the text over.

[ditt0]

Well the list-style-image attribute belongs to the list, not to the list item. Therefore you should specify it for the ul/ol/dl and not for the li/dt/dd. Then it will work:)

[fasterthanlight™]

Interesting, here are screen's of the affected list:

Windows IE
http://www.february-stars.com/win.gif

Mac FF
http://www.february-stars.com/mac.png


Its apparently not as big of a bug as I anticipated, but either way, I am a bit befuddled when it comes to placing the bullet where it needs to be.


The code I pasted in my first post is not the right chunk


.switchcontent
{
position: relative;
top: 0px;
margin: 0px;
padding: 0px;
width: 498px;
color: #666666;
background-color: #fafafa;
}

.switchcontent ul
{
list-style-type: circle;
display: block;
width: 481px;
margin: 0px;
padding: 0px 0px 0px 17px;
border-bottom: 1px solid #e4e4e4;
}

.switchcontent ul li
{
margin: 0;
width: 400px;
padding: 6px 0px 3px 0px;
}

[foodpk]

How about you just set a background image for the li, nudge the text a bit to the left and set the background-repeat to no-repeat. I recon that'll save you some general annoyance and such.

[fasterthanlight™]

Ya.. i suppose you are right... I wanted to try and avoid that because that method is gives me a whole new problem (some bullets don't show up, the first li bullet does though) I'll give it a shot tomorrow at work :D