Doesn't work quite right with transparent images
rinogo opened this issue · 2 comments
When using images with an alpha channel (e.g. transparent PNGs), the existing masking approach doesn't work quite right.
The current approach assumes that .first-overlay
will cover .second
. When transparent images are in use, that's not a safe assumption - .second
"shows through" where it shouldn't.
Fortunately, I was able to find a workaround in which I composited my background onto the images themselves. However, for a fully responsive design, it would be better to support transparent images natively.
Thank you for the feedback, @rinogo. I'll think about how to incorporate it in the future versions of the project.
There is native workaround - just assign some background on img. I.e. img {background: white;} and they will not see-through each other