IE中怎么会出现双倍边距?

  

  IE6.0环境中双倍边距BUG。先看下面的CSS代码。

div {

    float:left;

    margin-left:10px;

    width:420px;

    height:150px;

    border:1px solid red

    }

  这样设置以后。本来左边距设置为10px,但IE6.0解释为20px,这是一个比较头疼的问题。

  但解决也非常简单。办法就是是加上display:inline。就搞定了。看下面的示例对比!

双陪边距的效果:

Source Code to Run [www.fun52.com]

fun52.com

body {

margin:0

}

div {

float:left;

margin-left:10px;

width:420px;

height:150px;

border:1px solid red

}

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

   [ 可先修改部分代码 再运行查看效果 ]

解决BUG以后的效果:

Source Code to Run [www.fun52.com]

fun52.com

body {

margin:0

}

div {

float:left;

margin-left:10px;

display:inline;

width:420px;

height:150px;

border:1px solid red

}

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

Div+CSS XHTML XML 教程大全 – fun52.com

   [ 可先修改部分代码 再运行查看效果 ]

IE中怎么会出现双倍边距?

相关文章:

你感兴趣的文章:

标签云: