CSS problems with bullets in IE

[toarlach]

Has anyone had any problems with getting bullets to show up in IE?

I've got this CSS...

.article ul {
margin-left: 50px;
width: 440px;
}

.article li {
list-style: disc;
}

And it shows up fine in Firefox, but not in IE. Any suggestions on how I can
get bullets to show up in both browsers?

[chiron]

Try width in the LI and not the UL element?

I got it "not working with the above" and then "working with the mod" in IE 7 which is I presume the concern.

[billmarshall]

Without knowing the context of the surrounding code and which version of IE you're having the problem with it's difficult to be exact, however the golden rules for working with lists are:

1. Make sure you have explicitly declared list-style-position to be either inside or outside. IE and Firefox default to different settings for this and it can make a MAJOR difference to the result, including hiding the bullets in some circumstances of surrounding code.

2. Zero the margins and paddings on both the ul and li tags to start with, add a single pixel border on both (different colours so you can tell which is which) so you can see what's happening and then add margin or padding or widths back in as appropriate to the desired result before finally removing the borders.

That will sort it out for you 99% of the time. However having said that I've seen some circumstances where IE6 doesn't support the full range of options on the bullets, so you might not be able to get the look you want on all browsers. You can always experiment with using an image for the bullets using the list-style-image property.

Hope that helps.