Layout

Divider

Use .quanta-divider to separate content with horizontal or vertical lines. You can add optional text, orientation, and style variations.

Horizontal Divider

A basic horizontal line divider using .quanta-divider:

<div class="quanta-divider"></div>

Divider with Text

Use .quanta-divider-text to add centered text inside the divider:

<div class="quanta-divider">
  <span class="quanta-divider-text">OR</span>
</div>

Vertical Divider

Add .quanta-divider-vertical between inline elements:

<div class="d-flex align-items-center">
  <span>Left</span>
  <div class="quanta-divider-vertical"></div>
  <span>Right</span>
</div>

Divider Variants

Control thickness or style using .divider-thin, .divider-dashed, and others:

<div class="quanta-divider divider-dashed"></div>
<div class="quanta-divider divider-thick"></div>