Question

I have used html and body attributes to have a gradient background and a flower background for my website.

I have also used a div to have the bottom right hand flower where it is. Works great, but not when scrolling. How do i get the bottom right hand corner image to stick to the bottom of the screen ?

Answer 1

You will want to set position: fixed; instead of position: absolute;.

Here’s more info on the Position Property.

.bottomright {
     position: fixed;
     bottom: 0px;
     right: 0px;
}

.demo {
     background-color: HotPink;
     padding: 20px;
     margin: 5px;
}

Hello<br>

<div class="demo bottomright">
   I'm a Div!
</div>

there