Internet Explorer CSS - 居中Div

Question

Internet Explorer CSS - 居中Div

4

我最近做了一个网站，但在Internet Explorer中出现了一个非常大的问题。CSS在IE中似乎会发生奇怪的事情。与其在此处复制数百行CSS，不如提供一个指向网站页面的链接：http://www.appwheal.com/app/ios/angry-birds-space 所有内容都应该显示在屏幕中央。但是在IE中，它却粘在左边。我正在使用

margin-left: auto;

margin-right: auto;

这在IE中是被支持的，对吧。

请帮忙，先行致谢。

- John Wheal

可能是将div浮动到中心的方法的重复问题。 - Diodeus - James MacFarlane

4个回答

1

您还必须设置

body {
    text-align: center;
}

#yourDiv {
    margin: 0 auto;
    text-align: left;
}

- Kristian

DOCTYPE没有设置；IE以怪异模式渲染页面。 - saluce

是的，如果您在开发者工具中将文档模式更改为IE7，则可以完美地工作，而无需更改CSS，因此在body中设置text-align:center是不必要的。 - saluce

好的，我同意你的观点。但是一般来说，仅仅设置margin: 0 auto;只能算是解决问题的一半。有很多教程都建议为了可靠性考虑，应该包括另一部分（将body居中对齐，将wrapper左对齐）。 - Kristian

1

设置边距和宽度：

#yourDiv {
  margin: 0 auto;
  width: 300px;
}

- user2094324

0

你可以使用老派的 text-align:center，然后尝试 top:50%; left:50%; 并偏移适当的负像素。

- Gang Su

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- saluce · Accepted Answer

你需要声明一个DOCTYPE，否则Internet Explorer将默认使用Quirks模式（IE5兼容模式）。进入Internet Explorer，按F12打开开发人员工具，并注意它在文档模式下显示“Quirks”模式。Quirks不支持任何已知的div居中方法，声明DOCTYPE是修复问题最简单（也是推荐）的方式。

要将页面设置为XHTML 1.0 Transitional（最常见的方式），请使用：

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

要声明页面为HTML5兼容，请使用

<!DOCTYPE html>

DOCTYPE 行需要是 html 文件中的第一行，出现在开头的 <html> 标签之前。