Sticky Footer: CSS Tutorial (Day 13 of CSS3 in 30 Days)



Learn how to make a CSS Sticky Footer!

⭐️Files you need ⭐️
💻Sticky Foote Code: https://www.dropbox.com/sh/qwosotrp05shm28/AAAq729kd8IPUWZPyVlgzJxRa?dl=0
💻All tutorials in this series need this “_theme-styles” directory (only download once): https://www.dropbox.com/sh/890hx6ke34oovaz/AAByJ-jb-H5pWuIUx7t_GvQqa?dl=0

This video works as a stand-alone tutorial but is also day 13 of CSS3 in 30 Days. For the rest of the series, check out this playlist: https://www.youtube.com/playlist?list=PLWKjhJtqVAbl1AfjiGyYxwpdAPi5v-1OU

CSS3 in 30 Days is developed by Brad Hussey. Check out his website for more great tutorials: https://codecollege.ca/

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://medium.freecodecamp.org

And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp

source

This Post Has 17 Comments

  1. Phillip Shim

    Is this better way than giving footer "fixed" property?

  2. Mohit Bagadiya

    Can you make python's advance cource because begineer already has been uploaded? I am waiting..

  3. freeCodeCamp.org is the awesome channel. I have learned a lot from here and started my own channel being influenced to share knowledge. You have brought great change to me. Thank you so much. I would always seek for the feedback or any suggestions. Lot's of respect and love to you.😊

  4. Rook

    Option where footer height can be unknown: give .sticky-footer-lesson display:flex; flex-direction:column; min-height:100vh; give .page-content flex:1;

  5. I don't understand why this and why not use position:fixed with bottom:0 for the footer?! wouldn't that be a better choice for a sticky footer? I guess that goes same for the header too

  6. Yassine Farroud

    Hi everyone, i don't understand why we use after element we can do that without after element ? plz explain to me

  7. Tom

    Thank you so much! I tried 5 methods and none of them worked. yours finally made it!

  8. Tinned

    THANKS BRO U FIXED MY PROBLEM, CHEERS MATE I LOVE YOU

  9. Meh

    Thank you so much. BTW 0:44, is it just me or did you just forget to cut that?

Leave a Reply