水平居中,适用于所有浏览器

时间:2011-01-21 13:49:01

标签: html css

是否有一种非JavaScript的方式来集中页面的第一个容器div,它可以与IE,FF以及chrome一起使用?

margin:0 auto;在IE8中不起作用:(

5 个答案:

答案 0 :(得分:3)

这肯定应该在IE8中起作用,它之所以不起作用的原因可能是你的IE处于怪癖模式,可能是由于缺少DocType。 试试这个:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div style="width:50%;margin:auto;border:1px solid black;">TEST</div>
</body>
</html>

答案 1 :(得分:1)

margin:0 auto; works in IE8如果您的文档类型触发standards mode

如果你没有,你应该。如果你真的不想要一个you can hack around it

答案 2 :(得分:1)

margin: 0 auto;适用于所有浏览器(即使是IE6)。

你要么

  • 未指定width属性,因此您的容器实际上居中,它只覆盖宽度的100%,或
  • 搞砸了选择器,尝试使用color等属性或使用firebug进行调试
  • 正在触发怪癖模式,因为您没有指定doctype
  • 你的标记中有很多错误;尝试validating your markup并修复错误标记 - 因此浏览器不必猜测(并可能以不同的方式解释您的标记)

答案 3 :(得分:0)

我找到了一个不太好的解决方法

http://www.bluerobot.com/web/css/center1.html

如果有人知道更好的解决方案,请在此处提及。

答案 4 :(得分:0)

它适用于IE8,但您必须注意IE8,使用IE8标准模式可视化您的网页是个好主意......:标题中的此标记为S:

<meta http-equiv="x-ua-compatible" content="IE=8"/>