Windows的Firefox7中的背景图片未居中

Question

Using Browserlab, it appears that the background image is not centred in Firefox7 for Windows on this site: http://carolineelisa.com/wp/boy/

The css I am using is below, as is a screenshot.

Any ideas how I can fix this?

Thanks!

CSS:

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

Answer 1

The first value for the position is the horisontal value, the second is the vertical. So swap top and center :

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

Standards reference: http://www.w3.org/TR/css3-background/#ltbg-positiongt

Answer 2

Your html page background keeps centering itself even if the browser size is < 980px , but the container aligns itself to the left of the viewport, once the size is lesser.

Now, to address your issue, you should align the html's background to left and top if the width is lesser than 980px. So, with some responsive css:

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

Try this?