0

I want to show an image in a div in a following way:

  1. If image own size is smaller than div by both x and y axes, then it must be centered like so: black rectangle represents container div

  2. If the image is bigger than div by one axis, then it must be downscaled keeping aspect ratio to fit div by that axis, and be centered by another axis like so: enter image description here or so: enter image description here

I could do that using JavaScript, handling window resize etc, but I would like to achieve that with HTML/CSS only. Is it possible? How if it is? Why if it is not?

ironic
  • 8,368
  • 7
  • 35
  • 44

0 Answers0