CSS3 transform translate – Centrar elemento

CSS3 transform translate, o más correctamente transform:translate, nos sirve para centrar un elemento en una posición fija, relativa o absoluta.

CSS3 transform translate: Por norma general entendemos que para centrar un elemento en una página web lo podemos hacer con los parámetros CSS3:

top:50% y left:50%

Pero ¿Porqué no nos queda justamente en el centro? Una solución sería margin:auto podemos centrar un elemento con un:

 width:100% y height:100%

Dentro de otro con medidas reducidas pero si no tenemos ese elemento contenedor ¿Cómo lo conseguimos?

Hay que tener en cuenta que un elemento puede tener un tamaño específico de ancho y largo, por lo tanto dependiendo del tamaño del objeto nos queda descentrado. Continuar leyendo «CSS3 transform translate – Centrar elemento»