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

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

看到这个小提琴。

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