> Here is a demo where you can hover the image to show/hide the overflow:
Is something supposed to happen when I hover my mouse over the image? Because nothing happens. I'm using Firefox.
I'm using Firefox dev, it overflows for me. Are you sure you didn't hover the earlier screenshot of the unhovered image inside the red square, as opposed to the image inside a codepen embed?
You should, I think, at that point be seeing a square image of a jellyfish inside a red square. The square should be containing the image. When you hover, it should reveal the rest of the jellyfish (the image itself is rectangular, and wider than it is tall).
(I'm also using FF, and it works for me.)