首页 > 开发 > CSS > 正文

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

2024-07-11 08:26:50
字体:
来源:转载
供稿:网友
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;
}

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

Tutorial Image

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

Tutorial Image

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

解决方法

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



#container{
border: solid 1px #000;
background: #777;
width: 400px;

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

#element{
background: #95CFEF;
border: solid 1px #36F

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表