This CSS code will ensure that your footer stays at the bottom of the page, regardless of the size of the content.
Which is different than a Sticky footer. Sticky means that the footer will be at the bottom but always visible, on top of the content.
html,
body {
height: 100%;
}
body {
display: flex;
flex-direction: column;
}
footer {
margin-top: auto;
}
body {
height: 100%;
}
body {
display: flex;
flex-direction: column;
}
footer {
margin-top: auto;
}
Be sure to choose footer as the tag for your section in your footer template: