绝对位置噩梦 - 甚至无法将主要内容与全身背景居中
十分钟后，由于某种原因我已经不知所措，非常感谢任何帮助。我有一个正在尝试编码的布局，请参见此处。基本上，当您向下滚动页面时，我希望背景图像（咖啡豆）保持固定。然而，主要内容不想保持居中，背景图像也不想保持固定。无论我做什么，主体要么最终会向左对齐而不是居中，要么背景图像会变得一团糟。任何能给我指明正确方向的人都是英雄！到目前为止的页面可以在此处查看。
html, body {
background-color: #e0dac8;
}
#content {
background-image: url(IMG/bg_head.jpg);
background-color: #e0dac8;
background-repeat: no-repeat;
background-position: center top;
margin: 0px;
padding: 0px;
position: absolute;
}
#wrapper {
margin: auto;
height: auto;
width: auto;
}
Ten minutes in and already I'm in over my head for some reason, and any help is much appreciated. I have a layout I'm trying to code, seen here. Basically I want the background image (the coffee beans) to stay fixed as you scroll down the page. However, the main content does not want to stay centered, and the bg image does not want to stay fixed. No matter what I do, the main body either winds up aligning to the left instead of center, or the bg image gets way screwed up. Anyone that can point me in the right direction is a hero! The page so far can be seen here.
html, body {
background-color: #e0dac8;
}
#content {
background-image: url(IMG/bg_head.jpg);
background-color: #e0dac8;
background-repeat: no-repeat;
background-position: center top;
margin: 0px;
padding: 0px;
position: absolute;
}
#wrapper {
margin: auto;
height: auto;
width: auto;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
是你想要的吗？ http://jsfiddle.net/LRxpA/embedded/result/
我删除了绝对位置和居中位置#content 为“margin：0 auto;”，然后用“background-attachment：fixed;”固定背景。
这是代码： http://jsfiddle.net/LRxpA/
Is it that you want? http://jsfiddle.net/LRxpA/embedded/result/
I deleted postion absolute and centered #content with "margin: 0 auto;", then fixed background with "background-attachment: fixed;".
Here is the code: http://jsfiddle.net/LRxpA/
不要为此使用绝对定位。
只需添加边距：
Don't use absolute positioning for this.
Just add margins:
会成功的。
我尝试过的东西
will do the trick.
Something I tried