If only one of the attributes height
or width
is set for an img
element, most browsers seem to keep the proportions of the image.
This is from the HTML 4.01 reference:
When the object is an image, it is scaled. User agents should do their best to scale an object or image to match the width and height specified by the author.
http://www.w3.org/TR/html401/struct/objects.html#edef-IMG
Would it be wrong of a browser to scale the image non-uniformly, that is changing only the height or the width of an image?
Update 2015-08-12: Dillo (version 3.0.4) is an example of a browser which does not keep the proportions of an image if only height or only width is set.
If you look at what Bootstrap does with the .img-responsive class, it only sets height and max-width. http://getbootstrap.com/css/#images-responsive
If a browser didn't auto scale the width based on the height, this widely used CSS package would fail.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With