IE下li内元素浮动产生边距的解决办法

类似于这样的一个结构

 

<ul>
  <li><span style="float:left">left</span><span style="float:right">right</span></li>
  <li><span style="float:left">left</span><span style="float:right">right</span></li>
</ul>

 

我给每个li定义了高度，可是在IE下总是会出现2px的间距，为此我试过很多办法，clear:both;overflow:hidden;等等，都无效，最终一步步推断，是由于li里有浮动元素产生的，到网上搜索，找到解决办法：

 

li{vertical-align: bottom;}