अनुलंब नियम

हे कसे कार्य करते

अनुलंब नियम घटकाद्वारे प्रेरित आहेत <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>