CSS background-position not working in Mobile Safari (iPhone/iPad)

Question

I have an issue with background-position in mobile safari. It works fine on other desktop browsers, but not on iPhone or iPad.

body {
 background-color: #000         


        

Answer 1

Create a wrapper ID to place in the body, then include the following CSS:

#background_wrap {
    z-index: -1;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-image: url('../images/compressed/background-mobile.png');
    background-repeat: no-repeat;
    background-attachment: scroll;
}

Just ensure that none of your content goes within the div otherwise the whole page will be fixed with no scrolling.