Alignment

Usage #

Superkube has several classes for specifying text horizontal and vertical alignment.

• align-left
• align-center
• align-right
• align-top
• align-middle
• align-baseline
• align-bottom

<p class="align-left">...</p>
<p class="align-center">...</p>
<p class="align-right">...</p>

The alignment classes can be mixed for other modules or for blocks inside them.

<div class="card align-center">
    <div class="card-head">...</div>
    <div class="card-body">...</div>
</div>

Responsive #

To change the behavior on small screens, just add the suffix -sm.

<p class="align-center align-left-sm">...</p>