Vertical alignment

Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.

Example

Use .vstack to stack buttons and other elements: 

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

Vertical rules scale their height in flex layouts:

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

With stacks

They can also be used in stacks:

First item
Second item
Third item
<!-- vr -->
																<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>