How to Always Keep the Footer at the Bottom of A Page | Learn HTML and CSS | HTML Tutorial

How to Always Keep the Footer at the Bottom of A Page | Learn HTML and CSS | HTML Tutorial. In this lesson we will learn how to keep the footer at the bottom of our page. Meaning that we don't want the footer to go above the height of our browser, when we don't have a lot of content on our pages.

➤ GET ACCESS TO MY LESSON MATERIAL HERE!

First of all, thank you for all the support you have given me!

I am really glad to have such an awesome community on my channel. It motivates me to continue creating and uploading content! So thank you!

I am now using Patreon to share improved and updated lesson material, and for a small fee you can access all the material. I have worked hard, and done my best to help you understand what I teach.

I hope you will find it helpful :)

[devbros]

Thank's for the tutorial. Since I was using a bootstrap footer all I had to do is this for the css:


* {
margin: o;
padding: o;
}

html, body {
height: 100%;
}

#container {
min-height: 100%;
}

#main {
overflow: auto;

}
Make sure you are using Id's instead of classes because bootstrap will mess you up!

[assassincreed]

I came here to learn about keeping the footer at the bottom of a page and got surprised how dumb I was this whole time, just learn about the *{margin:0;padding: 0;} thank you so much, you didnt just help me with the footer but you also helped me in my general coding. TYSM!!! you deserve my like, subscribe and my comment.

[eandrea]

I just started html and css 2 weeks ago and it"s been killing be why my footer is not at the bottom. I'll make sure to check out your classes. THANK YOU!

[quinnplush]

Thank you so much! After 5 different tutorials, yours was the one that worked!

[louman]

Thank you so much. This is the one thing I have struggled with for such a very long time.

[waronamogobye]

I don't get why anyone hasn't designed a function for this. Thanks a lot

[tatesuh]

I like how he left 30 seconds of nothing at the end so he could get 10mins lol

[riaish]

cant thank you enough, this helped a lot for the angular application which was loading the footer first all the time. just applied the css on the global css file and referenced the id's in the html.. worked like a charm, thanks buddy!

[alusinemansaray]

Many thanks for your lectures. They are highly intuitive and beneficial to what I have been doing

[gurulovearthi]

Last one weeks in am searching this one thank u lot bro from india…

[jozsefsido]

THANK YOU!!! I have been searching for solution to this for long long hours and finally here I have found it! THANK YOU!

[neilcuarteron]

your videos are the cleanest tutorials of all

[mlensment]

You, sir, are a lifesaver for us backend folks, who struggle with basic front end tasks.

[klynesenyahan]

Hello sir Dani. I'm very thankful for the smooth discussion you share to us about HTML and CSS,
I already finish this course and I'm now a great fan of yours. Thanks for being a blessing to us beginners. Keep safe.

[raniaayad]

Thank you it worked ..I only used the full hight lines with body and html and and min hight with the main..

[ladyd]

OMG I've been struggling with this for ages, thank you so much, soo helpful

[pythusiast]

thank GOD it worked finally... thanks man

[suleimanhajj]

You are the best, Thank you sooo much, this worked for me in the first 3 minutes!!!

[zakhariihusar]

I was looking for silver but found gold1️⃣🥇. Have seen so many useless tutorials before found this. I just needed to add one more div inside of a div to solve the problem👏

[vigiantvortx]

Thanks for showing the part where you actually put text in the footer. Now I have to spend an extra hour watching videos in how to do it.