Frontend.fyi

Tutorial

The Only And Easy Way To Push That Footer Down With CSS

When building websites it's the small details that matter most. Too often I see websites where there page content is very short, and all of a sudden we have a floating footer.

Try it yourself in our playground

Follow along with the tutorial, or just play around with the code. PRO members can fork this code and save it to their account.

Go Pro

Playgrounds are part of PRO

Frontend.fyi Playgrounds let you take any code example and turn it into a live, editable sandbox — so you can tweak the code, build on it, and learn by doing.

This feature is part of Frontend.fyi PRO, which gives you lifetime access to:

  • Interactive playgrounds (like this one)
  • Full courses (Framer Motion, CSS, and more coming)
  • Copy-paste UI recipes with video walkthroughs
  • Your own public profile to showcase projects and experiments (soon!)

If you're ready to go beyond just watching tutorials and actually build things yourself, PRO is for you.

When building websites it’s the small details that matter most. Too often I see websites where there page content is very short, and all of a sudden we have a floating footer. [insert me facepalming here]

With modern CSS it is SO easy to fix this, that there’s literally no reason to have this happening on your site. Let me show you how!

Eager to learn more?

I think this video might be a good fit for you too!