在IE中使用margin:0 auto页面不能居中-百分百源码网

在IE中使用margin:0 auto页面不能居中

发布时间：01/15 来源：浏览：关键词：

可能不少朋友会碰到在ie浏览器中使用margin:0 auto发布页面并不能居中，这个问题听朋友说是ie bug我们只能加text-align:center来解决。

今天小涛偶然间发现了一个问题，就是某些页面用IE浏览器的时候margin:0 auto页面不能居中，其他浏览器正常，搜索了一下发现两种解决方案：

1、更改DOCTYPE为 xhtml 1.0 tranditional (html 4.01 下无效)
2、在块外边添加div,并对此div应用text-align:center

加一个3C 调用声明

Html代码

代码如下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

我不想加

还有一个说法，说要给body加一个属性

Html代码

代码如下
text-align:center;

我更不想加，代价有点大

既然给body加这个属性能行，那干嘛不在外面包上一个带这个属性的div呢
测试之，通过

代码如下
<div style="text-align:center;"> <div style="margin:0 auto;">居中</div> </div>

网上有朋友说

可以尝试下使用绝对定位到父级元素的一半, position:absolute;left:50%; 然后使用居中元素一半宽度的左负空白边,例如居中元素宽度为 760px; margin-left:-360px

总结：

IE6跟火狐的区别,IE的text-align:center能使其包含的块状元素和行内元素以及文本内容居中.
而在火狐下面text-align:center只能使其包含的行内元素和文本内容居中.

margin:0 auto能使块状元素居中,但不能使行内元素居中,这个在火狐和IE6下都是一样的.对于IE6以前版本的浏览器需要配合其父元素的text-align:center才能居中，您还为IE下使用margin:0 auto页面不能居中的问题头痛吗

打赏

感谢您的支持，我会继续努力的!

扫码打赏，你说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

百分百源码网建议打赏1～10元，土豪随意，感谢您的阅读！

在IE中使用margin:0 auto页面不能居中