Warning: Internet Explorer version 10+ only
I've started adding a footer to my Origin Code Academy projects that links to my Github, LinkedIn, and website. I'm used to having a sticky footer done for me with what I used to use at work, or having enough content that it doesn't matter. Since the bootcamp projects are usually small, I discovered a troubling gap in my skills. So here is all you need to make a sticky footer using only CSS:
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
flex: 1 0 auto;
}
Make sure you have a main
tag somewhere in your HTML. It can even be empty. I wrap my <div ui-view></div>
with the main tag when doing Angular UI-Router projects.