White space at the bottom of the page on tablet/phone

I use a image as page background, this is the code:

    body {
    background-color: black;
    background: url(/images/bg.jpg); 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 100% 0%;
}

It looks okay on computer but if I open the page from a tablet or phone there is white space at the bottom of the page.

Here is how it should look:

And here is how it looks on tablet: