.footer{
margin-top: 1rem;
padding: 1rem;
background-color: rgb(235, 195, 64);
position: fixed;
bottom: 0;
left: 0;
width: 100%;
}#container {
display: flex;
min-height: 100vh;
flex-direction: column;
}
#main-content {
flex: 1;
} <div id="container">
<Header loaded={loaded} />
<div id="main-content">
<Switch>
<Route
path="/about"
render={props => <About loaded={loaded} {...props} />}
/>
<Route
exact
path="/"
render={props => <MainPage loaded={loaded} {...props} />}
/>
<Redirect to="/" />
</Switch>
</div>
<Footer />
</div>