分享

IE6双倍margin问题

 明天网吧 2014-11-19
       

IE6出现双倍margin的情况:浮动,且margin方向与浮动方向相同。

例:css:


ul.li { list-style:none;}
ul { overflow:hidden; zoom:1; width:220px; margin-left:10px; border:1px solid #ccc;}
ul li { float:left; margin-left:5px;}
ul li a { display:block; width:100px; height:20px; text-align:center; background:#ccc;}


html:


<ul>
<li><a href=”#”>双倍margin问题</a></li>
<li><a href=”#”>双倍margin问题</a></li>
</ul>
IE6双倍margin

IE6下便出现了双倍的外边距。

解决的办法:

1、在li设置“display:inline”

2、不是办法的办法,避免margin的方向与float的方向相同。例如写成这样:ul li{ float:left; margin-right:5px;}

3、有一次上面所有的方式都不行,用这个display:inline-block;就可以了

以下为引用的内容:
.floatbox { 
float: left; 
width: 150px; 
height: 150px; 
margin: 5px 0 5px 100px; 
display: inline; 

}


转自:http://hi.baidu.com/jlldhd/blog/item/5dac8e13584931c7c2fd7818.html

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多