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
CodePudding user response:
max-height vs. max-width : the case for setting max-width
- Setting both max-height and max-width can change the aspect ratio of the image, which is often not desired
- 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
CodePudding user response:
Yes. Some pages have content placed horizontally :)
CodePudding user response:
Depends entirely on what you are trying to do. The vh and vw measures are only useful if you want to create blocks relative to the screen size without using jQuery.
The min and max width options are mostly used in dynamic blocks. For example to prevent empty blocks from collapsing, or blocks with a lot of content to stretch a design element beyond its intended size.