Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

background-size:cover leaves blank space in Chrome for Android

I'm trying to get a nice fullscreen image background for my website. It's working fine in almost every browser I tested in (browsershots.org), but in Chrome on my Android tablet it's not working as expected. As you can see there's a lot of white in the background, where it should be all image.

Link : http://test.socie.nl

CSS :

body {
    background: url(../../images/background/image1.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

Unexpected result :

like image 998
Jurgen Avatar asked Dec 05 '12 10:12

Jurgen


1 Answers

Solved by adding the following:

html {
  height:100%;
  min-height:100%;
}

body {
   min-height:100%;
}
like image 151
cdrev Avatar answered Oct 10 '22 04:10

cdrev