As a web developer, everyone need sometimes to make a div stick to the bottom of a web page.

Generally, I got a lot of questions related to this topic but don’t found the complete guide.

In this tutorial, I am going to share with you a complete tutorial on how to create a fixed sticky footer notification bar in HTML with CSS.

Creating a sticky div is very easy if you have a knowledge of basic CSS. 
So, here you will see how you can stick a div to the bottom of the page using CSS.

HTML

 
some text
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
sometext
 
 
 
StickyFooter 

CSS

.stickynotification {
position: fixed; 
bottom: 0; 
right: 0; 
width: 100%; 
height: 45px;
background-color: #28a745; 
color: #fff; 
font-size: 20px; 
z-index: 99999; 
border-radius: 50px; 
text-align: center; 
}

So, you have learnt how to make a div stick when scrolling with HTML & CSS. If you have any query related to this tutorial, feel free to comment.

The post Make Div Stick to The Bottom of Page appeared first on PhpCluster.