在列表li里两个浮动div兼容IE6问题

本来一个很简单功能，却难以兼容IE6，

<ul class="ulDiv" style="width: 302px; ">

  <li onmousemove="this.style.backgroundColor='#6699FF'" onmouseout="this.style.backgroundColor='#ffffff'">

    <div  style="float: left"> name </div> <div style="float: right;"> times </div>

  </li>

  <li onmousemove="this.style.backgroundColor='#6699FF'" onmouseout="this.style.backgroundColor='#ffffff'">

    <div  style="float: left"> name </div> <div style="float: right;"> times </div>

  </li>

</ul>

实现很简单，就在li里用2个div或者span，一个左浮动，一个右浮动，效果是实现了，但在IE6下，每个li的底部会有4像素的空白。但在firefox和chrome下却没问题，百思不得其解，后来把右边浮动的div改为 text-align: right; 

下面是CSS代码：

<style>

.ulDiv {

    padding: 0;

    width: 302px;

    border: 1px solid #111111;

    background: #ffffff;

}

ul {

    margin: 0;

    padding: 0;

    list-style: none;

    background: #ffffff;

}

ul li {

    line-height:1.5em;

    margin: 0;

    padding: 0;

    width: 302px;

    background: #ffffff;

    cursor: default;

    font-size: 12px;

    height: 20px;

}

</style>

如果谁知道在li如果有两个div都是浮动，在IE6下，每个li的底部会有4像素的空白的原因，麻烦指教下小弟，谢谢。