Html （没有将这些图像居中，有修复方法吗？）？

我的问题是，除了IE6、7和8之外，“高中”、“中学”和“小学”图像在所有浏览器中都可以完美地集中

页面相关部分：（为清晰起见进行了编辑）

CSS:

HTML:

即：

铬：

我做错了什么

编辑：

---

请参阅此处的固定版本：。上面的链接是为了存档而保持一致的快照

在页面前面加上

，让浏览器尝试遵守CSS规范

现在你让浏览器呈现这些页面，就好像这是2001年一样

---

技术上的解释是，在IE6怪癖模式下，如果不在标准模式下，自动边距将无法工作。如果必须使用quirks模式，解决方法是在父元素上应用

text align:center

。但是您应该使用标准模式，即sane模式。

属性float:left in education\u level\u包装函数可能是导致此问题的原因

使用边距调整定位，而不是

浮动

---

哇，那很简单。。。谢谢由于布局原因，浮点属性是必需的。如果你看

.education\u level

你会发现我试图使用

边距。IE标准模式是问题所在，请参见公认答案。
#block {
    clear: both;
    width: 682px;
}
.education_level_wrapper {
    float: left; 
    width: 100%;
}
.education_level {
    margin-bottom: 3px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

<div id="block">
    <div class="education_level_wrapper">
        <img src="[sniped]/Title_HS.png" class="education_level" />
    </div>
</div>