1

我想将这些绿色 div 之间的灰色 div 居中：

http://i.stack.imgur.com/iRgwl.png

我一直在做我能想到的所有事情，但我几乎无法正确地将 div 对齐在中心。

这是我的代码：

html:

<div id="header">
  <div id="header_pattern"></div>
  <div id="header_menu">
    <div id="menu_wrap">Contejnt for  id "header_menu" Goes Here</div>
  </div>
</div>
<div id="container">
  <div id="main_photo">Content for  id "container" Goes Here</div>
</div>
<div id="footer">
  <div id="footer_main">Content for  id "footer_main" Goes Here</div>
</div>

CSS：

#header {
    height: 150px;
    margin: 0px;
    padding: 0px;
    position: absolute;
    width: 100%;
    left: 0px;
    top: 0px;
    float: left;
    z-index: 900000;
}
#header_pattern {
    height: 50px;
    width: 100%;
    left: 0px;
    top: 0px;
    background-image: url(images/head_pattern.png);
    background-repeat: repeat-x;
    background-attachment: fixed;
}
#header_menu {
    background-color: #19350f;
    height: 50px;
    width: 100%;
    left: 0px;
    top: 50px;
}
#container {
    height: 850px;
    width: 960px;
    top: 100px;
    background-color: #666;
    position: absolute;
    margin-right: auto;
    margin-left: auto;
    left: auto;
}
#main_photo {
    height: 450px;
    width: 960px;
}
#footer {
    height: 150px;
    width: 100%;
    position: absolute;
    left: 0px;
    top: 950px;
    background-color: #2f772f;
}
#menu_wrap {
    height: 50px;
    width: 960px;
    margin-right: auto;
    margin-left: auto;
}
#footer_main {
    height: 150px;
    width: 960px;
    margin-right: auto;
    margin-left: auto;
}

请尽快回复，谢谢。:)

4

3 回答 3

1

只需添加left:0;和标记right:0;#container

#container {
height: 850px;
width: 960px;
top: 100px;
background-color: #666;
position: absolute;
margin-right: auto;
margin-left: auto;
left: auto;
left: 0;
right: 0;
}

它会做那件事

于 2013-08-20T08:09:26.077 回答
0 
#container {
height: 850px;
width: 960px;
top: 100px;
background-color: #666;
position: absolute;
margin-left: -480px;
left: 50%;
}
于 2013-08-20T08:05:22.050 回答
0 
#container {
  margin-left:auto;
  margin-right:auto;
}
于 2013-08-20T08:09:54.583 回答