Como centrar una imagen o bloque (div) usando CSS. Como centrar un texto o imagen en HTML.

Para centrar una imagen, texto o un bloque(div) en un página web, la forma mas fácil es usando CSS.

En este ejemplo vamos a definir un bloque cuadrado de 400px. Usamos width and height para definir la altura y el ancho.

Es necesario definir el ancho del bloque para así poder centrar el mismo con CSS, si no se define el ancho no se va a centrar correctamente.

Por último, definimos las margenes izquierda y derecha del bloque(div), estas calcularan el ancho de la pantalla y automaticamente calcularan el centro, así.

[infobox style=”alert-info”] .bloqueCuadrado { width: 400px; height: 400px; margin-left:auto; margin-right:auto;} [/infobox]

[editr item=”post-788″ html=”centrarbloque.html” css=”centrarbloque.css” scrollbar=”dark” theme=”monokai” ]

Add Comment