Helper classes

Vertical alignment

Vertical align inline elements having different line height.

Top aligned text.

Middle aligned text.

Bottom aligned text.

<h1><small class="valign-top">Top</small> aligned text.</h1>
<h1><small class="valign-middle">Middle</small> aligned text.</h1>
<h1><small class="valign-bottom">Bottom</small> aligned text.</h1>

Vertical align elements inside table cells.

Example
row
Top Middle Bottom
<table>
  <tr>
    <td class="valign-top">Top</td>
    <td class="valign-middle">Middle</td>
    <td class="valign-bottom">Bottom</td>
  </tr>
</table>

Vertical alignment inside block elements

This helper classes will not vertically align content inside block elements.