Div (oder jedes andere Element) vertikal zentrieren

Ein Element per CSS vertikal zentriert auszurichten, ist bisher recht trickreich und fummelig gewiesen. Mit CSS3 Transforms gibt es jetzt eine etwas elegantere Lösung, mit der sich Text und jedes andere Element vertikal zentrieren lassen:

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

CSS3 transform Property @w3schools.com

snippet, css, css3