how to make sticky footer with react router

1document.addEventListener('click', function(e) {
2    e = e || window.event;
3    var target = e.target || e.srcElement,
4        text = target.textContent || target.innerText;   
5}, false);

1  <div id="container">
2    <Header loaded={loaded} />
3    <div id="main-content">
4      <Switch>
5        <Route
6          path="/about"
7          render={props => <About loaded={loaded} {...props} />}
8        />
9        <Route
10          exact
11          path="/"
12          render={props => <MainPage loaded={loaded} {...props} />}
13        />
14        <Redirect to="/" />
15      </Switch>
16    </div>
17    <Footer />
18  </div>

1#container {
2  display: flex;
3  min-height: 100vh;
4  flex-direction: column;
5}
6
7#main-content {
8  flex: 1;
9}