Вертикално правило

Користете го приспособениот помошник за вертикални правила за да креирате вертикални разделувачи како <hr>елементот.

На оваа страница

Како работи

Вертикалните правила се инспирирани од <hr>елементот, што ви овозможува да креирате вертикални разделувачи во заеднички распоред. Тие се стилизирани исто како <hr>елементи:

Тие се 1pxшироки
Имаат min-heightод1em
Нивната боја се поставува преку currentColorиopacity

Прилагодете ги со дополнителни стилови по потреба.

Пример

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

Вертикалните правила ја размеруваат нивната висина во флексибилни распореди:

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

Со купчиња

Може да се користат и во купчиња :

Прва ставка

Втора ставка

Трета ставка

<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>