html ios background,html - Background size on iOS - Stack Overflow

I've spent the morning doing research on the following issue. I'm making a one page site, using a lot of images. I'm aware that Safari is known for its weird handling of background-attachment:fixed, but that's working fine; my problem is background-size:cover is not working in conjunction with fixed.

I have 5 pages, all of which have a height or min-height of 100%. The last page is fixed like this:

#div5 {

height:100%;

width:100%;

position: relative;

background-image: url("img/background.jpg");

background-attachment:fixed;

-webkit-background-size: cover;

-moz-background-size: cover;

-o-background-size: cover;

background-size: cover;

}

On iOS (in both Chrome and Safari) the background image is scaled to cover the full webpage, so it's really stretched.

At the same time, page 4 has the following css:

#div4 {

min-height:100%;

width:100%;

background:url(img/portfoliobg.jpg);

overflow: auto;

background-size: cover;

}

and this works like a charm.

So, something makes the browser behave really weirdly when combining fixed and cover. Does anyone have a solution to this?