Vertical Align Center

To make content vertical center.

by lotabout

HTML

<div class="container">
  <div class="vertical">
    <p>
      Why do I feel something wrong here?
    </p>
  </div>
</div>

CSS

.container {
  border: 1px solid blue;
  height: 200px; /* maybe any height */
  display: table;
}

.vertical {
  display: table-cell;
  border: 1px solid green;
  vertical-align: middle;
}