Eu descobri uma maneira muito simples de criar um rodapé fixo para o meu site e, à primeira vista, ele parece funcionar perfeitamente.

Mas como não vejo outras pessoas usando a mesma coisa,Gostaria de saber se esta maneira de fazê-lo está quebrado, fora dos navegadores que não oferecem suporte à caixa flexível?

Eu uso o bootstrap para configurar o flex-box e estou trabalhando no React, aqui está o meu código:

<div className="body-div d-flex flex-column justify-content-between">
  <div>  <!-- inner div -->
    <MainNav/>
  </div>
  <MainFooter className="d-flex flex-column"/>
</div>

Para pessoas que não sabem reagir: a div externa pode ser vista como o elemento do corpo em uma página html 'normal'.

css para o corpo-div:

min-height: 100vh;

Então, basicamente, deixo a div interna e o rodapé principal serem empurrados para cima e para baixo, respectivamente, configurando seu contêiner para flex-box com a propriedade justify-content definida como espaço intermediário.

Também gostaria de acrescentar que o conteúdo do meu site, com exceção do rodapé, fica dentro da div interna.