问题在 IE8 中使用 CSS 居中 div答案

【问题标题】：Problem centering div in IE8 with CSS问题在 IE8 中使用 CSS 居中 div
【发布时间】：2010-09-23 01:01:42
【问题描述】：

基本上我有以下 HTML/CSS 布局

HTML：

<div id="container">
    <div id="main">
        <h1>TEST</h1>
    </div> 
</div>

CSS：

#cont {
  width: 100%;
  background: #ddd;
}
#main {
  width: 900px;
  background: #fff;
  margin-left: auto;
  margin-right: auto;
}

这在 FF、safari、Chrome 和 Opera 中运行良好，但 IE8 仍将“主”div 向左对齐。

有谁知道可能是什么问题？提前致谢。

【问题讨论】：

标签： html css

【解决方案1】：

您只需要将#cont 的css #cont 更改为#container 或将div 的id 更改为cont。

在 IE8 中对我来说效果很好。 http://jsfiddle.net/5M6X9/

【讨论】：

【解决方案2】：

您是否定义了文档类型？

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

此外，去掉第一个 div 的 width: 100% 和 body 必须有 padding: 0 和 margin: 0

【讨论】：

【解决方案3】：

IE 需要正确的 DOC 类型！

我一直用

#main{
  margin:0 auto;
}

并且 width:100% 不是必需的。

将 0 替换为顶部和底部边距或

#main{
  margin:30px auto 0;
}

仅用于上边距

【讨论】：