Una de las cosas que más te pueden llegar a desesperar cuando estás trabajando en el diseño de tu página web es cómo alinear verticalmente cualquier elemento de la web con CSS.
Con CSS3 Transform vamos a poder hacerlo de manera muy, muy sencilla:
.verticalcenter{ position: relative; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%);
transform: translateY(-50%); }
Usando esta técnica, todo se alineará verticalmente, desde una sola línea de texto, una serie de párrafos o una foto.
En cuanto a la compatibilidad con exploradores, CSS3 Transform funciona bien con Chrome 4, Opera 10, Safari 3, Firefox 3 e Internet Explorer 9.
Vía Hongkiat
Deja un comentario