CSS Lists, IE vs Firefox?

You should be able to normalize lists margins and padding by simply setting them yourself in the CSS. The one exception is that in IE6 (I’m pretty sure this doesn’t happen in 7…) lists get a little extra space that’s almost impossible to get rid of. The workaround is to form lists with line breaks like this:

<ul
><li>Item one</li
><li>Item two</li
><li>Item three</li
></ul>

It’s a little odd looking, but doesn’t break anything and fixes the extra space in IE6.

Does that help?

Sorta. I have utilized my own setting of the margin / padding in CSS but they still display differently in IE7 vs FF3… thoughts?

Try setting the style for all ul elements to have no margins or padding on all sides and then use a separate style to define the list your trying to style on top of that.

Better yet, use Yahoo’s reset and base stylesheets to make styling more consistent.

Eric Meyer also has a fantastic reset style.

Thanks for your help everyone with your stylesheets as bases. However, I am already doing this with no avail. So I take it no-one can aide in this?

If you send me a link to the files, I’ll try to track down the problem.

I suggest abandoning IE 6. Forget the workarounds. Eventually we’ll reach critical mass and people won’t be able to use IE 6 anymore. It will be a glorious day.

Hear hear!