最常见IE的Bug及其fix修复方法

1. 居中布局

创建一个CSS定义把一个元素放到中间的位置，可能是每一个Web开发人员都会做的事情。最简单的做法是为你的元素增加一个margin: auto; ，然而 IE 6.0 会出现很多奇怪的行为。让我们来看一个例子。

#container{
border: solid 1px #000;
background: #777;
width: 400px;
height: 160px;
margin: 30px 0 0 30px;

}


#element{

background: #95CFEF;
border: solid 1px #36F;
width: 300px;
height: 100px;
margin: 30px auto;
}

下面是我们所期望的输出：

但IE却给我们这样的输出：

这应该是IE 6对margin的 auto 并没有正确的设置。但幸运的是，这是很容易被修正的。

解决方法

最简单的方法是在父元件中使用 text-align: center 属性，而在元件中使用 text-align: left 。

height: 160px;
margin: 30px 0 0 30px;
text-align: center;
}

#element{
background: #95CFEF;
border: solid 1px #36F;
width: 300px;
height: 100px;
margin: 30px 0;
text-align: left;
}

2. 楼梯式的效果

几乎所有的Web开