CSS Centering Vertical align anything with 3 lines of code


Example

Supported by IE11+

View Result

Use these 3 lines to vertical align practically everything. Just make sure the div/image you apply the code to has a parent with a height.

CSS

div.vertical {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

HTML

<div class="vertical">Vertical aligned text!</div>