How to put auto-adjustable background to the screen?
I put it like this in my body but when I enter the cell phone it cuts the background, only stays where it has an element.
body{
clear: both;
background:url(../img/background-login.png) center center fixed;
background-size:cover;
-webkit-background-size: cover;
-o-background-size: cover;
-khtml-background-size: cover;
-moz-background-size: cover;
min-height:100% !important;
}
Instead of using 100% 100% use cover .
background-size:cover;
-webkit-background-size: cover;
-o-background-size: cover;
-khtml-background-size: cover;
-moz-background-size: cover;
The difference is that with 100% 100% it will always reach the maximum of 100% be it, vertical or horizontal. The cover will 'cover' div . But in contrast, it can cut (and certainly will) cut or slightly from the sides, or the top and bottom of the image.
Edited:
Try this:
body,html {
min-height:100%;
//ou
min-height:100% !important; //Use somente se este não estender o 'body'
}
Please try:
background-image:url('../images/bg.png');
background-repeat:no-repeat;
background-size:contain;
background-position:center;