css - 有滚动条时背景固定不居中

Question

我的容器背景有问题。当有滚动条时，我的内容和我的背景之间就有了差距。没有滚动条时没有任何问题。

捕获

我认为这是因为我的背景以整个窗口为中心（包括滚动条），而我的内容以边距为中心：0 auto; （不包括滚动条）。

这是我的CSS代码...

#container{
    background-image:url('../img/container.png');
    background-attachment:fixed;
    background-position:top center;
    background-repeat:no-repeat;
    margin:0 auto;
    width:900px;
    padding:0 37px;
    padding-bottom:25px;
    }

我尝试在左侧添加 15px 的填充，它可以工作，但是当没有滚动条时，它不再居中了！当我的背景不固定时，它也可以工作，但我需要保持固定...

你有解决这个问题的方法吗？

Answer 1

唔。你不能用 HTML/CSS 创建你的背景框吗？这将确保定位是一致的。

Answer 2

这是错误的

background-position:top center;

第一个值是水平位置，第二个值是垂直位置。

CSS background-position 属性

使用更正代码

background-position:center top;