How to create a fixed footer

Sometimes you may need to keep the footer at the bottom of the page, regardless of the page height content. I found many solutions, but almost all of them use too much code, require the use of display flex or grid for the entire page or are script-based.

Below you can find my, very simple CSS-based solution, I hope it works for you too:

<body>
  <footer>…</footer>
</body>

body {
   min-height: 100vh;
   position: relative;
}

footer {
   position: sticky;
   top: 100%;
}

That's all!