<div class="goriz">
  <div>Блок<br>при горизонатальном выравнивании.</div>
</div>

<div class="goriz">
  <div class="vertic">
    Блок выровнен по горизонтали,<br>и текст по вертикали.
  </div>
</div>

.goriz {
  background-color: hsla(168, 34%, 59%, .5);
  display: table;
  margin: 10px auto; /*центрируем блок по горизонтали*/
  text-align: center; /*текст в блоке по центру*/
  padding: 20px; /*внутрение отсупы для красоты*/
}
.vertic {
  display: table-cell;
  vertical-align: middle; /*вертикальное выравнивание*/
  text-align: center; /*текст в блоке по центру*/
  height: 120px;
  border: 1px solid orange;
  padding: 20px; /*внутрение отсупы для красоты*/
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.