如何在IE7中定位一个绝对定位的div？ [英] How to center an absolutely positioned div within IE7?

问题描述

更新版本的更新提供内容

我的网页结构比较简单。页面由两个绝对定位的div组成。一个在另一个中心。

I have a relatively simple structure for my page. The page is composed of two div's both absolutely positioned. One is centered within the other.

<div id="protocol_index_body_wrapper">
    <div id="protocol_index_body">
    </div>
</div>

其中包含相应的CSS：

Which has the corresponding CSS:

#protocol_index_body_wrapper {
    background: url("/images/stripe.png") repeat scroll 0 0 transparent;
    position: absolute;
    top: 120px;
    left: 0px;
    right: 0px;
    bottom: 10px;
}
#protocol_index_body {
    width: 960px;
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

}

预期的行为见上图。此行为存在于IE8，Firefox和Chrome中。然而，在IE7中，应该居中的div与左侧齐平。任何想法？

The expected behavior is seen in the image above. This behavior is present in IE8, Firefox, and Chrome. However, in IE7 the div which should be centered is flush against the left side. Any ideas?

推荐答案

尝试：

#protocol_index_body {
    width: 50px;
    margin: 0 auto 0 -25px;
    position: absolute;
    top: 0;
    left: 50%;
    right: 0;
    bottom: 0;
    background-color: red;
}

或...

#protocol_index_body {
    width: 50px;
    margin: 0 auto 0 50%;
    position: absolute;
    top: 0;
    left: -25px;
    right: 0;
    bottom: 0;
    background-color: red;
}

这篇关于如何在IE7中定位一个绝对定位的div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！