css - 水平居中对齐 block 元素

标签 css

我认为很多像我这样的人一直这样做:

html {
    text-align: center;
}

body {
    margin: 0 auto;
    width: 80%;
    text-align: left;
}

我什至不记得我们为什么添加 text-align: center;到父元素，必须是为了浏览器兼容性？好吧，现在简单地放弃它安全吗？

编辑:目标只是居中对齐<body>元素，不用于任何文本对齐等。

最佳答案

这是因为 IE6(以及较旧的 + 我认为 IE7 处于古怪模式)以这种方式将所有元素(block 和 inline)居中， margin: auto 在那里不起作用。

其他浏览器(非 IE)无法通过 text-align: center; 使 block 元素居中。正如规范所述，他们使用 text-align: center 用于 inline 元素，margin: auto 用于 block元素。

如果你不想支持 IE6，你可以删除它。

关于css - 水平居中对齐 block 元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28609139/

相关文章：

html - 为什么这个 CSS 选择器不起作用？