Search code examples
cssfootersticky

How to get sticky footer on every page

Hi I have troubles to get the footer sticky.

The other pages are sticky because of the content. But on a empty page or page with few content not working.

The code:

html, body {
    height: 100%;
}
footer {
    position: absolute;
    bottom: 0;
}

If I use

position: absolute;
bottom: 0;

it works on this page but not on the other pages. Also tried with min-height

Solution

  • Try this:

    #page {
    min-height: 100vh;
    position: relative;
}

footer {
    bottom: 0;
    position: absolute;
}