Question

I have an HTML page, and this css:

body {
color:#000;
/*BG Image is specified by javascript*/
background-repeat:no-repeat;
background-position:top left;
}

What you have to know, is that the page is not big enough in height, so if loaded correctly, there’s a small gap between the bottom of the screen and the last line of text displayed.

I would like to make it so that the background sticks to the bottom right part of the screen, but when I change top left to bottom right, it just seems to stick to the bottom of the webpage (aka where the text ends), rather than to the bottom of the screen. I’m not sure if there is a solution, but if there is, please let me know

Answer 1

you need a background-size: cover property in the body tag

this will make the background cover the whole body element

try this

body {
    background-position: bottom right;
    background-attachment: fixed;
    background-repeat:no-repeat;
    background-size: cover;
}