0

我的 HTML+CSS 图形

我对这个页面的问题是“高中”、“初中”和“小学”图像在除 IE6、7 和 8 之外的所有浏览器中都完美居中。

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

CSS：

#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;
}

HTML：

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

IE：

替代文字

铬合金：

替代文字

我在这里做错了什么？

编辑：

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

4

2 回答 2

1

在您的页面前添加<!DOCTYPE HTML>以使浏览器尝试遵守 CSS 规范。

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

技术解释是，在 IE6 怪癖模式下，如果不处于标准模式下，自动边距将无法工作。如果您必须使用怪癖模式，解决方法是应用于text-align:center父元素。但是你应该使用标准模式，也就是理智模式。

于 2010-08-03T19:24:22.060 回答
0

education_level_wrapper 函数中的属性 float: left 可能是导致此问题的原因。

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

漂浮

于 2010-08-04T11:14:21.870 回答