centrar verticalmente

[Zeromm]

Buenas!!

Lo del centrado vertical me mata.. SIEEEMPRE!!

En el siguiente caso, ¿como hariais para centrar verticalmente el id "principal" sea cual sea el ancho de la pantalla?

http://codepen.io/zeromm/pen/duyGj

[pzin]

Supongo que te refieres al alto.

Yo haría algo tal que:

Código CSS:

div#principal {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
 

Dado que translate(X|Y) toma como referencia al propio elemento siempre se centrará. Obviamente html y body necesitarán tener una altura.

[Zeromm]

Anda, mira tú, este sistema no lo conocía :)

Graaacias ;)