更新了布局的上下文
我的页面结构相对简单。该页面由两个绝对定位的 div 组成。一个以另一个为中心。
<div id="protocol_index_body_wrapper">
<div id="protocol_index_body">
</div>
</div>
里面有对应的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 与左侧齐平。有什么想法吗?
最佳答案
试试这个:
#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;
}
关于html - 如何在 IE7 中将绝对定位的 div 居中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8218582/