css - 背景图像不在 Firefox7 for Windows 中居中

Question

使用 Browserlab，背景图像似乎没有在该站点上的 Firefox7 for Windows 中居中：http: //carolineelisa.com/wp/boy/

我正在使用的 css 如下所示，截图如下。

有什么想法可以解决这个问题吗？

谢谢！

CSS：

html {
    background: url(images/background.jpg) no-repeat top center #0f0c0b;
}

Answer 1

位置的第一个值是水平值，第二个是垂直值。所以交换top和center：

background: url(images/background.jpg) no-repeat center top #0f0c0b;

标准参考：http ://www.w3.org/TR/css3-background/#ltbg-positiongt

Answer 2

即使浏览器大小为 ，您的 html 页面背景也会保持居中< 980px，但是一旦大小变小，容器就会将自身对齐到视口的左侧。

现在，为了解决您的问题，如果宽度小于 980 像素，您应该将 html 的背景对齐到左侧和顶部。因此，使用一些响应式 css：

@media screen and (max-width: 980px) {
    html{
      background-position: left top;
    }
}

试试这个？