Feb
1

Algunos blogs y foros de hoy en día, tienen problemas con las imágenes grandes que se publican en sus artículos y comentarios, debido a que en ocasiones el tamaño de éstas  es demasiado grande lo que causa una deformación en el skin que están usando, y por consigueinte incomodando la lectura de la página para sus visitantes.

Dicho problema se soluciona en algunos sitios usando scripts php o JavaScript, pero estos métodos requieren un poco más de conocimiento para implementarlos bien, sin embargo hay una forma muy sencilla de hacer esto con CSS.

Para empezar deberíamos tener una estructura HTML similar a esta:

<div id="post">
	texto con o sin la imagen
</div>

Ahora lo único necesario para realizar el redimensionado es escribir en nuestro *.css lo siguiente:

#post img{
  max-width: 600px;
  height: auto;
}

Siendo max-width: el ancho máximo que queremos que tenga la imagen.  Si lo que deseamos es establecer la altura máxima en lugar del ancho bastaríacambiar la palabra height por width y viceversa.

Tags:
Categoría Manuales, Producción propia | 3 Comentarios »