Twe kɔ emu nsɛm atitiriw no so Twe kɔ docs navigation so
Check
in English

Mmara a ɛda hɔ gyina hɔ

Fa custom vertical rule helper no yɛ vertical dividers te sɛ <hr>element no.

Wɔ kratafa yi so

Sɛnea ɛyɛ adwuma

Mmara a ɛda hɔ no <hr>, element no na ɛkanyan wo, na ɛma wo kwan ma wobɔ mpaapaemu a ɛda hɔ wɔ nhyehyɛe ahorow a wɔtaa yɛ mu. Wɔayɛ no style te sɛ <hr>elements no ara pɛ:

  • Wɔatrɛw 1pxmu
  • Wɔwɔ min-heightof1em
  • Wɔn kɔla no yɛ set via currentColorneopacity

Fa styles afoforo yɛ wɔn sɛnea ɛho hia.

Nhwɛsoɔ

html na ɛwɔ hɔ
<div class="vr"></div>

Mmara a ɛwɔ hɔ gyina hɔ no susuw wɔn sorokɔ wɔ flex nhyehyɛe ahorow mu:

html na ɛwɔ hɔ
<div class="d-flex" style="height: 200px;">
  <div class="vr"></div>
</div>

Ne stacks a wɔde ahyɛ mu

Wobetumi nso de adi dwuma wɔ stacks mu : .

Ade a edi kan
Ade a ɛto so abien
Ade a ɛto so abiɛsa
html na ɛwɔ hɔ
<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>