CODEWITHSUNDEEP
css
mahan
mahan

Reputation: 14935

css max-height or max-width to restrict image size

Why should you not use max-height to restrict the size of an image?

Both max-width and max-height can be used to restrict the size of en element.

This WC article suggests using max-width to fit the image in its container. https://www.w3.org/WAI/WCAG21/Techniques/css/C37

Is there any reason not to use max-height to restrict size of an image should you have a web applicatin with vertical content flow?

https://developer.mozilla.org/en-US/docs/Web/CSS/max-height

https://developer.mozilla.org/en-US/docs/Web/CSS/max-width

Upvotes: 0

Views: 77

Answers (2)

ControlAltDel
ControlAltDel

Reputation: 35011

max-height vs. max-width : the case for setting max-width

  1. Setting both max-height and max-width can change the aspect ratio of the image, which is often not desired
  2. Setting max-width can be used to ensure that the image "fit" horizontally. In most cases this is preferable, as people are used to scrolling web pages vertically, but not so much horizontally.

With that being said, it is up to you to determine which to use based on your requirements

Upvotes: 1

apocalypse
apocalypse

Reputation: 5884

Yes. Some pages have content placed horizontally :)

Upvotes: 0

Related Questions