mantener el porcentaje de width y height en las imagenes

[waldragon]

Buenas, tengo un form para subir imagenes a mi web, el problema es que si suben una imagen de 100px de ancho y 100px de alto, esta todo bien porque despues la muestro asi <img src="http://misitio/imagenes/imagen.gif" width="50" height="50">
y hago que se vea mas chica pero en proporciones iguales, pero si un usuario sube una imagen de 150px de ancho y 200px de alto, al mostrarla sale deformada, como puedo hacer para que mantenga las proporciones??? gracias.

[_Adrian_]

Tendrías que hacerlo con algún lenguaje de programación, ej. JavaScript o PHP.

[lizfranco]

Hola.

Con CSS no podrás asignarle un nuevo tamaño a tus imagenes.
Lo que sí podrías hacer con CSS sería darle un max-width y max-height de 50px a las imagenes.
De esa forma si la imagen es mas ancha que alta, se disminuirá so ancho hasta 50px. Y por el contrario si es mas alta que ancha se diminuirá su altura hasta 50px.

Código HTML:

.thumbnail {
   max-width:50px;
   max-height:50px;
}
* html .thumbnail { 
   height: expression( this.scrollHeight > 49 ? "50px" : "auto" ); 
   width: expression( document.body.clientWidth > 49 ? "50px" : "auto" );
}
...
<img class="thumbnail" src=".../image.gif" />