Layout gecentreerd

Centreerd de inhoud van het element op zowel de horizontale als de verticale as.

Toelichting: de inhoud van het blok wordt gecenteerd. Als de inhoud 100% breed is kan het lijken alsof deze helper niet werkt. Pas in dat geval de breedte van de onderliggende elementen aan of kies een andere geschikte layout. Tekst binnen de elementen wordt niet gecentreerd.

Voorbeeld

Visueel voorbeeld:

Lorem ipsum

Dolor sit amet.

HTML-voorbeeld:

<div class="centered">
  <h1>Lorem ipsum</h1>
  <p>Dolor sit amet.</p>
</div>

Bijbehorende bestanden

Voor meer informatie over importeren en instellen van componenten. Zie: Componenten gebruiken en styling toevoegen

Importeer component via npm

CSS-voorbeeld:

@use "@minvws/manon/layout-base";
@use "@minvws/manon/layout-centered";

Instelbare variabelen

Dit element heeft zelf geen instelbare variabelen.