The solution to creating a sticky footer is incredibly easy nowadays thanks to Flexbox. Have a DOM that follows this structure:
<body>
<div>
Place all of your website in this div.
It doesn't even have to have a class!
</div>
<footer>
This footer will hug the bottom no matter what its height.
</footer>
</body>
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!