html - Margin after list items in IE -

i using code show <ul>:

<ul>   <li class="odd"  id="lid-3">breakbeat</li>   <li class="even" id="lid-11">classical</li>   <li class="odd"  id="lid-16">downbeat</li>   <li class="even" id="lid-30">filmmusik</li>   <li class="odd"  id="lid-24">folk&amp;country</li>   <li class="even" id="lid-40">jazz/blues</li>   <li class="odd"  id="lid-48">latin</li>   <li class="even" id="lid-64">pop/mainstream</li>   <li class="odd"  id="lid-68">reggae</li>   <li class="even" id="lid-75">rock</li>   <li class="odd"  id="lid-81">techno/electro</li>   <li class="even" id="lid-35">urban</li>   <li class="odd"  id="lid-88">world</li> </ul> 

and css:

ul span {     display: block;     padding: 1px 0 1px 5px;     cursor: pointer;     font-size: 12px; }   ul {     padding: 0;     margin: 0;     overflow: hidden; }  ul li {     padding: 0px 0 2px 5px;     cursor: pointer;     height: 14px;     margin: 0;     display: block;     overflow: hidden;     position: relative; } 

whatever do, list items have bottom margin. come from? how can solve problem?

set line-height on li 1em - make line-height same font-size.

even better, set line-height 1.4, gives nice spacing items don't run together.

this mean if increase size of font, won't need change line-height within li's if - , update if user sets larger font-size.