手机 html cover出错,html - "background-size: cover" does not cover mobile screen - Stack Overflow...

I have a photo background on my site using background-size:cover. It works for the most part but leaves a weird ~30px white space on my Galaxy S3 in portrait mode.

I've attached a screenshot. The 1px teal line is to illustrate the entire screen. Seems like the background stops right after the social media uls.

I tested this by removing the ul and the background attached it self to the bottom of the tagline text.

Also, here's my CSS pertaining mobile portait view:

@media only screen and (max-width: 480px) {

.logo {

position: relative;

background-size:70%;

-webkit-background-size: 70%;

-moz-background-size: 70%;

-o-background-size: 70%;

margin-top: 30px;

}

h1 {

margin-top: -25px;

font-size: 21px;

line-height: 21px;

margin-bottom: 15px;

}

h2 {

font-size: 35px;

line-height: 35px;

}

.footer_mobile {

display: block;

margin-top: 20px;

margin-bottom: 0px;

}

li {

display: block;

font-size: 1.3em;

}

This used to not happen, but I guess I accidentally bugged it while trying to solve another issue.