IE及标准浏览器中DIV居中问题

来源:互联网 发布:linux snmp测试 编辑:程序博客网 时间:2024/05/19 02:44

在标准浏览器中,设置margin:0 auto;即可使元素居中,但IE不这样理解,也就不会让标签居中。好在IE中还有text-align:center属性,可以设置在其它浏览器文本居中,但IE又不同,它会解释为一切都居中,包括标签,所以这两个一起用是浏览器兼容的处理。当不想在IE中其它DIV中文本居中,可以在父层中设置一下text-align:left;即为原本的默认属性,其他浏览器不会受到影响。

例如

.box{width:100%;}

.box .contBox{width:970px;height:500px;margin:0 auto;}

此CSS文件中的CLASS标签。在FF中就可以正常显示居中,但是IE中就不会。

IE中只能这么设置

.box{width:100%;text-align:center;}

.box .contBox{width:970px;height:500px;text-align:left;}

所以要最终的效果可以这么做

.box{width:100%;text-align:center;}
.box .contBox{width:970px;height:500px;margin:0 auto;text-align:left;}

这样就可以兼容各种浏览器了,也就是说,页面DIV在不同的浏览下,都会做居中显示

0 0
原创粉丝点击