解决li在ie、firefox浏览器中行高不一致的问题

发布时间:2019-12-31编辑:脚本学堂
本文分享下,li标签在在ie、firefox浏览器中行高不一致的解决方法,有遇到这个问题的朋友,不妨作个参考。

本节内容:
li在ie与firefox的高度不一致。

解决办法:
设置li的样式为:
li font-size:0;
然后,再将其子元素复为12px。

例子:
 

复制代码 代码示例:
<style type="text/css">
.tu_freeline_list li{text-indent:10px;font-size:0;height:30px;line-height:30px;overflow:hidden;zoom:1;}
.tu_freeline_list li span{float:left;height:30px;overflow:hidden;width:155px;font-size:12px;}
.tu_freeline_list li strong{float:right;font-size:12px;}
</style>
<ul class="tu_freeline_list">
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
<li><b class="textc00">css教程学习</b><span><a href="#">www.jb200.com css教程学习</a></span></li>
</ul>