Conserver le pied de page en bas avec Flexbox et les marges en CSS

Cette méthode fonctionne très bien. La marge va permettre de pousser le pied de page en bas de page peu importe la quantité de contenu de la page. Il faut bien entendu au préalable déclarer une disposition flexbox dans le document.

Partager la démonstration :

Partager sur Facebook
Partager sur Twitter-X
Partager sur Linkedin

Voir d'autres manières de conserver le pied de page en bas avec CSS




<body>

<header>

</header>

<main>

...
</main>


<footer>

</footer>

</body>








body {
min-height: 100vh;
display: flex;
flex-direction: column;

}

main {

margin:0 auto;
max-width: 80ch;

}

	
footer {

margin-top: auto;

}