JimDabell3 hours ago
I’ve seen this used before to add a credit that only appears when you save the image. You append the credit to the bottom of the image, then crop the image with CSS using a technique like this to hide the credit. Then when somebody saves the image, they get the whole thing and the credit appears.
philipov9 hours ago
> 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.
deathanatos9 hours ago
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.)
LoganDark8 hours ago
I'm using Safari on Mac and it also does not work for me.
philipov9 hours ago
yeah, I see the square jellyfish image inside the red square, but nothing changes when I hover.
justin667 hours ago
It's a schooner!
purpleshellx9 hours ago
[dead]
Razengan8 hours ago
Most people have
bryanrasmussen6 hours ago
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?
philipov4 hours ago
Definitely using codepen. I can manipulate the scaling and view the html and css windows and stuff. I'm not using the latest firefox version, but it's not like this is a new feature right?
exploraz3 hours ago
Works for me on FF stable 148.0, 153.0.4, but does not with FF 145.
exploraz3 hours ago
Okay, I've figured it out, thanks to the "test distros online" thingy to test version 145 and 148 as I previously mentioned.[0]
From Firefox 148 release notes for developers:[1]
> The overflow, overflow-x, and overflow-y CSS properties can now be used on replaced elements such as images, in the same way that they are used with other elements. Prior to this, replaced elements were always clipped to their bounding container. (Firefox bug 1999100).
[0]: https://news.ycombinator.com/item?id=49272986 [1]: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Rel...