Pystysuuntainen sääntö

Käytä mukautettua pystysuuntaista sääntöapua luodaksesi pystyjakajia, kuten <hr>elementtiä.

Tällä sivulla

Kuinka se toimii

Pystysuuntaiset säännöt ovat elementin inspiroimia <hr>, joten voit luoda pystysuuntaisia jakajia yleisiin asetteluihin. Ne on muotoiltu aivan kuten <hr>elementit:

Ne ovat 1pxleveitä
Heillä min-heighton1em
Niiden väri asetetaan painikkeilla currentColorjaopacity

Mukauta niitä lisätyyleillä tarpeen mukaan.

Esimerkki

html

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

Pystysäännöt skaalaavat niiden korkeuden joustavassa asettelussa:

html

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

Pinojen kanssa

Niitä voidaan käyttää myös pinoissa :

Ensimmäinen kohde

Toinen kohde

Kolmas kohde

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>