Centered

HTML

<div class="parent">
    <div class="child">Centered</div>
</div>

CSS

Flex layout

.parent {
  display: flex;
  align-items: center;
  justify-content: center;
}

Grid layout

.parent {
  display: grid;
  place-items: center;
}

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