https://codepen.io/powerseed/pen/poBxEeM
I guess this is some default setting of HTML, but it is really weird and counter-intuitive.
The div is like a box, img is an item inside the box, how is that possible that the item inside a box is bigger than the box, like a ball is bigger than its packing box?
It is against ppl's life experience.
I wonder what is the rationale behind this setting?
In other words, what downs will happen if it is not like this?
Thanks.
Top comments (1)
It has to do with overflow. The same thing will happen if you have text without any spaces. You can use object-fit to control the image to fit in the container along with maintaining the aspect ratio.