Classic stack

HTML

<div class="parent">
    <header>...</header>
    <main>...</main>
    <footer>...</footer>
</div>

CSS : Grid layout

.parent {
  display: grid;
  grid-template-rows: auto 1fr auto;
}

Bonus : vous ne voyez pas comment intégrer ce snippet ? Télécharger gratuitement ma CSS Layout toolbox ; c’est une collection de snippets prêtes à l’emploi.

← Retour vers la liste des mise en page