Ga direct naar inhoud
Ga direct naar inhoud
Ga direct naar inhoud

horizontal

Introductie

Het horizontaal uitlijnen van elementen binnen een container. Dit kan handig zijn voor het uitlijnen van knoppen, formulieren of andere elementen die naast elkaar moeten staan.

Snelstart

SCSS importeren:

    
    @use "@minvws/manon/utility/horizontal";
  

Voorbeelden

Voorbeeld: Horizontaal uitgelijnd

    
    <div class="horizontal">
  <!-- horizontaal uit te lijnen content -->
  <button class="secondary">Terug</button>
  <button>Verder</button>
</div>
  

Voeg de class horizontal toe op het horizontaal uit te lijnen element.

Voorbeeld: Object met horizontaal uitgelijnde elementen

    
    <div class="horizontal-group">
  <div>
    <!-- horizontaal uit te lijnen content -->
    <button class="secondary">Terug</button>
    <button>Verder</button>
  </div>

  <div>
    <!-- horizontaal uit te lijnen content -->
    <button class="secondary">Terug</button>
    <button>Verder</button>
  </div>
</div>
  

Voor het horizontaal uitlijnen van meerdere objecten binnen een element voeg de class horizontal-group toe.