Question

Is there a way to proportionally resize an image if the height and width are already defined in the tag?

Obviously, if I have an image tag like:

<img src="whatever.jpg" width="500" height="350">

and use max-width like:

img { max-width: 200px; }

I’ll end up with an image that is 200px by 350px.

I’d prefer a pure CSS solution (which I’m fairly sure does not exist), but might also be able to use some Javascript and/or jQuery.

Answer 1

Ofcourse, you set the other dimension to auto:

img{
    height:auto;
    width:200px;
}