CSS to keep the footer of an HTML page at the bottom of the page with a minimal height and not overlap the page
body {
margin: 0;
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
display: block;
flex: 1 0 auto;
}