Vertical align

This module allows to set vertical alignment of an inline or inline-block box.

Mnemonics

Bases

Modifiers

Optional extensions

v = vertical

-base

-top = align top edges
-mid = center within the row
-btm = align bottom egdes

-m = medium
-l = large

Examples

The following examples add visible top and botton borders on each element to better show the different options available.

<span>Reference</span>
<span class="v-base">.v-base</span>
<span class="v-top">.v-top</span>
<span class="v-mid">.v-mid</span>
<span class="v-btm">.v-btm</span>

Reference

.v-base

.v-top

.v-mid

.v-btm

Source code

/* generate: container-rule */
.v-base     { vertical-align: baseline; }
.v-top      { vertical-align: top; }
.v-mid      { vertical-align: middle; }
.v-btm      { vertical-align: bottom;}
/* end generate */

Air CSS ver. 2.3.2