当前位置: 主页 > 网页制作 > CSS > 在IE下CSS li标记产生间距及解决方法

在IE下CSS li标记产生间距及解决方法

时间:2009-12-15来源:互联网 点击:

当li元素设置了高度,且li内元素浮动时会触发该bug。

<style>
li{ background-color: green; height: 20px; }
li a { float: left; }
li span { float: right; }
</style>
<ul>
<li><a href="">aaa</a><span>bbb</span></li>
<li><a href="">aaa</a><span>bbb</span></li>
</ul>
解决方法:li设置css vertical-align: bottom;

<style>
li{ background-color: green; height: 20px; vertical-align: bottom; }
li a { float: left; }
li span { float: right; }
</style>
<ul>
<li><a href="">aaa</a><span>bbb</span></li>
<li><a href="">aaa</a><span>bbb</span></li>
</ul>

上边的方法一般都会解决问题,但是许多时候许多未知的原因,还会导致间距问题的出现。试试以下方法:
1.定义行高 line-height
2.设置隐藏 overflow:hidden
3.li增加浮动属性 float

站长资讯网
. TAG: CSS li标记 解决方法

查看[在IE下CSS li标记产生间距及解决方法]所有评论
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码:
关于我们 | 友情链接 | 网址推荐 | 常用资讯 | 网站地图 | RSS | 网站留言