相对于包含div的绝对位置
相对于包含div的绝对位置
提问于 2012-08-03 10:41:35
我希望在一个更大的居中的"all“div中有几个绝对定位的div容器，它必须有相对定位，以便它可以在浏览器中居中，这样我就可以完全控制内部div，同时仍然可以有一个居中的页面。我试过这样做：
<body>
<div id="all">
<div id="header"></div>
<div id="main"></div>
<div id="footer"></div>
</div>
</body>以此作为css：
#all
{
background-color:#ffffff;
margin-left:auto;
margin-right:auto;
width:1000px;
height:1300px;
}
#header
{
background-color:#ff0000;
position:absolute;
top:0px;
left:0px;
width:1000px;
height:200px;
}
#main
{
background-color:#00ff00;
position:absolute;
top:200px;
left:0px;
width:1000px;
height:1000px;
}
#footer
{
background-color:#0000ff;
position:absolute;
top:1200px;
left:0px;
width:1000px;
height:100px;
}但是，#header，#main和#footer都是分开的，并与顶部和左侧对齐，没有居中，与父级div #all完全分开，因为#all像它应该的那样居中。谁能解释一下为什么会发生这种情况，并告诉我一个解决办法？
Stack Overflow用户
回答已采纳
发布于 2012-08-03 10:47:07
给#all position:relative;，事情应该会像预期的那样工作。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11788516
复制相关文章
相似问题
腾讯云开发者
