Download

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!

What are you waiting for?

Start building your site today.

  1. 1 Download Publii
  2. 2 Write your content
  3. 3 Publish your site
Create website