Why does this CSS not work for Chrome on Android but works everywhere else?
I do not wanna be cruel but this issue has been reported approximately 4 years ago
http://code.google.com/p/android/issues/detail?id=3301
most recent response can help I guess:
In my experiments with Android, I noticed that all the other DIVs within the body behaved correctly, including centering, so I moved image to another DIV and it worked.
Funny one.
best
I have the similar problem.. and I fix it with this
html{ height:100%; min-height:100%;}body{ min-height:100%;}
I have found a workaround that makes the background display correctly on Chrome for Android: define the background in the html tag, not the body. Here is the new css:
html{ background-color: transparent !important; background-image: url(<%= asset_path "pic.jpg" %>); background-position: center center; background-repeat: no-repeat; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
And yes, this is valid markup. In my experience, the background still works correctly in every other browser too.