Rodapé na parte inferior da página ou conteúdo, o que for menor
Eu tenho a seguinte estrutura:
<body>
<div id="main-wrapper">
<header>
</header>
<nav>
</nav>
<article>
</article>
<footer>
</footer>
</div>
</body>
Eu carrego dinamicamente o conteúdo no<article> usando javascript. Por causa disso, a altura do<article> bloco pode mudar.
eu quero o<footer> block para estar na parte inferior da página quando houver muito conteúdo, ou na parte inferior da janela do navegador quando existirem apenas algumas linhas de conteúdo.
No momento eu posso fazer um ou outro ... mas não ambos.
Então, alguém sabe como eu posso fazer isso - obter o<footer> para ficar na parte inferior da página / conteúdo ou na parte inferior da tela, dependendo de qual é menor.