<UL> - <LI> has strange gaps in IE

[glenelkins]

Hi

 

In IE on an unordered list there appears to be a few pixel gap between each <LI> item. I have looked all over for a solution and all of them  ( apparently tried and tested ) don't work! They all say it happens when using display: block or display: inline-block  ... but im not using either and its still happening. Here is the css:

 

#navigation_left ul {

margin: 0px;
padding: 0px;

margin-left: 10px;
margin-top: 15px;

list-style: none;

}

#navigation_left li {

margin: 0px;
padding: 0px;

font-size: 8pt;
font-weight: bold;

color: #FFFFFF;
}


#navigation_left li a:link { font-weight: bold; font-size: 8pt; color: #FFFFFF; text-decoration: none; }
#navigation_left li a:visited { font-weight: bold; font-size: 8pt; color: #FFFFFF; text-decoration: none; }
#navigation_left li a:hover { font-weight: bold; font-size: 8pt; color: #FFFFFF; text-decoration: underline; }

[jumpenjuhosaphat]

Have you tried using line-height:0; in you li properties?

[bronzemonkey]

This is probably a "hasLayout" issue since your list items have no properties that trigger IE's bizarre "hasLayout" property. Try using {height:1px;} in an IE-only stylesheet.

[haku]

A link almost always helps in these situations. Do you have one?