Question

使用负边距将元素放在中心可以在支持它的所有现代浏览器中正常工作。

但在IE6中，我们能做些什么？

例如，此代码在IE6中失败：

HTML：

<div id="parent">
    <div id="child"></div>
</div>

CSS：

#parent{
    position: relative;
    width: 500px;
    height: 500px;
    margin: 25px auto;
    background: skyblue;
}

#child{
    position: absolute;
    width: 300px;
    height: 100px;
    left: 50%;
    margin-left: -150px;
    top: 25px;
    background: orange;
}

请参阅this fiddle。

Answer 1

这可能不适用于您的特定场景，但您可以尝试使用边距和填充而不是定位吗？

#parent{
    width: 500px;
    height: 500px;
    margin: 25px auto;
    padding-top: 25px;
    background: skyblue;
}

#child{
    width: 300px;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
    background: orange;
}

绝对中心水平，负边距，IE6

1 个答案: