Fix DIV to bottom right corner

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

Answer 2

if you put the flower inside a div and position it absolute bottom and right this will stick it there.

For example, something like this will work

#mystylename{      position:absolute;      bottom:0;      right:0; } 

you may need to tweak it to get it sat where you want and also maybe add a z-index