ie浏览器浮动出现双边距问题
在我们的页面设计中,经常用到float这里属性,在IE中的浮动比较特别,会出现双边距的情况,下面来讨论下这个问题
1、什么情况会出现双边距
IE浏览器的浮动,如果浮动的元素的浮动方向设置的外边距,则浮动后的外边距是浮动前的两倍。如下图:
div{ float:left; margin-left:10px } 代码执行后看到的margin-left其实是20px
如果浮动的方向和设置的外边距方向不一样,则不会出现这个问题,如向左浮动,设置的是margin-right,则不会出现双边距的情况。
同一行多个浮动的元素,如果全都满足出现双边的条件,则只有第一个元素会出现双边距,其他的元素不会。
2、解决的办法
给浮动的元素添加display: inline;