Desde hace algunos posts atrás que estoy usando el Markdown de John Gruber (eso será otro post) y una de las ventajas es que cada bloque de texto separado por una línea en blanco lo encierra entre <p> y </p> entre muchas otras cosas, pero eso significa que ya no puedo encerrar una imagen entre <center> y </center>, porque también esta encerrado entre <p> y </p> y eso no valida.

Por lo que siguiendo la filosofía de separar diseño y contenido estoy usando CSS para posicionar las imágenes en un post, sea centrado o no, tenga borde o no. Según yo usando un simple text-align: center dentro de una clase era suficiente, pero no.

Haciendo una búsqueda en Google me encuentro con lo obvio, el text-align: center influencia el contenido del bloque, pero no el bloque en si, por lo que la imagen nunca se centraría, pero usando el siguiente código puedes hacerlo:

img { display: block; margin: auto; }

Espero me haya explicado, pero es sencillo y fácil. En mi caso cree una clase en mi CSS:

#content .upload-center {
display: block; 
margin: auto;   
}

Y asi, solo cuando quiera centrar inserto la clase dentro del <img>.

Suscríbete gratis a Hipertextual

Estamos más ocupados que nunca y hay demasiada información, lo sabemos. Déjanos ayudarte. Enviaremos todas las mañanas un correo electrócnio con las historias y artículos que realmente importan de la tecnología, ciencia y cultura digital.