Align

Adjust vertical alignment with these utilities.

To adjust the alignment of an element, use .align-baseline, .align-top, .align-middle or .align-bottom. The vertical-align property only applies to inline or table-cell boxes.

Hamburger

.align-baseline

.align-top

.align-middle

.align-bottom

<div class="overflow-auto">
  <div class="table">
    <div class="table-cell"><h1>Hamburger</h1></div>
    <div class="table-cell align-baseline">.align-baseline</div>
    <div class="table-cell align-top">.align-top</div>
    <div class="table-cell align-middle">.align-middle</div>
    <div class="table-cell align-bottom">.align-bottom</div>
  </div>
</div>

CSS Source

.align-baseline { vertical-align: baseline }
.align-top      { vertical-align: top }
.align-middle   { vertical-align: middle }
.align-bottom   { vertical-align: bottom }

4 Rules

4 Selectors

4 Declarations

1 Properties

Utility Layout

White Space