How to have a sticky footer with modern CSS

The solution to creating a sticky footer is incredibly easy nowadays thanks to Flexbox. Have a DOM that follows this structure:

    Place all of your website in this div.
    It doesn't even have to have a class!

    This footer will hug the bottom no matter what its height.

And then this CSS, which you can download here:

html, body {
  height: 100%;

body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;

That's all there is to it. Enjoy!