In this tutorial, we are going to create sticky footer CSS example. Sticky footer sticks to the bottom of the page. It doesn’t matter how long your page was. but it is really very important to make sure you apply it correctly. Every time when you create your footer there is lot’s of thing that effect to your footer. for example, if you create your website. you need to create a sticky footer for your website but it does not stick to the bottom of the page. This code will solve this simple problem.

So let’s get jump into the code.

Create HTML file

Create simple HTML file. Name your file as what you want. Import this code into this HTML file.

In the div class of Footer, we have created full width and full height div. Then create div with the “foo” class which is our footer. Then create a <h4> tag to display your message. You can take any footer. For example, we created a simple all rights reserved text.

if you are using external style sheet then this code will not work. So to work this code properly you need to create a Style.css file and add this code to it.


This simple Example will show you how you can create your own simple starter footer. This example is for beginners. I hope this article help beginners to stick there Footer on the bottom of the page.

That’s all for today’s┬álesson. See you tomorrow with a new lesson and example.

Follow us On Youtube.

Thank You. Have a Nice day.