Here is the link I left out the first time:
I apologize if this has been answered a thousand times, but I did a search
of the archives and didn't find reference to this specifically (< as it
pertains to the <a> element widths).
The following page has two identical lists with only a slight difference in
the CSS for the two divs holding the menus. In the first (goodmenu) a width
IS specified for the <a> tag, and everything looks good in IE Win. In the
second (badmenu) the width is NOT in the CSS, and the typical extra spacing
between <li> items shows up in IE.
The extra spacing in Win for a menu list (or any list probably) I know can
be somewhat solved with putting all the <li> items on one line or doing the
funky tag closing thing.
I actually hadn't remembered about the above fix, though, before trying a
million other things and just stumbling upon adding an explicit width to the
<a> tag, which seemed to fix ALL of the extra white space.
Does anyone know why this works, though? Is one fix preferable over the
other? Is this idea of adding explicit width to the <a> element well known?
I couldn't find anything that jumped out at me when I did a search for
"Extra list white space in IE."
Actually, using the width instead of the process of putting all the <li>
items on one line seems to be quicker and more elegant. Even when putting
all <li> items on one line, I still get a little extra spacing in IE than
other browsers, though it's much better than when the <li>'s are on separate
City of Springfield, MO
Public Information Office
The box said "Windows 98 or better. So I bought a Mac!"
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/