Vertikal regel

Bruk den tilpassede vertikale regelhjelpen for å lage vertikale skillelinjer som <hr>elementet.

På denne siden

Hvordan det fungerer

Vertikale regler er inspirert av <hr>elementet, slik at du kan lage vertikale skillelinjer i vanlige oppsett. De er stylet akkurat som <hr>elementer:

De er 1pxbrede
De har min-heightav1em
Fargen deres er satt via currentColorogopacity

Tilpass dem med flere stiler etter behov.

Eksempel

html

<div class="vr"></div>

Vertikale regler skalerer høyden i fleksible oppsett:

html

<div class="d-flex" style="height: 200px;">
  <div class="vr"></div>
</div>

Med stabler

De kan også brukes i stabler :

Første element

Andre element

Tredje element

html

<div class="hstack gap-3">
  <div class="bg-light border">First item</div>
  <div class="bg-light border ms-auto">Second item</div>
  <div class="vr"></div>
  <div class="bg-light border">Third item</div>
</div>