Description
Hi, first I want to thank you for the great article on backface-visibility, and many others on Codrops.
I found out that on Fifrefox (50.1.0 - frefox for Manjaro) on Linux (Manjaro - Archlinux derivative), the example with flipping card does not work. The front side stays visible and mirrored.
I played a bit in your live editor and found out that by commenting out the z-index properties for .back and .front classes the issue is resolved.
I have also tested that on Chromium (v55.0.2883.87) and Opera (v42.0.2393.94) on my system, and removal of the z-index does not affect the functionality.
I also tried this on Browserstack.com on Mac Sierra for the latest versions of Firefox and Chrome.
On Firefox on Mac the background gets changed but the text from the front of the card still shows through.
Again, I tried commenting out the z-index as I did on my machine, and the issue was resolved. That change did not affect the animation on Chrome, i.e. didn't broke it.
I understand why is the z-index used here, but it appears as if it is not needed. Maybe it is there for old browsers, but it would be good if it worked on the newest too.
On the other hand, this might be the Firefox bug, I don't know, but I just wanted to let you know about this issue.
All the best,
Vojislav Grujic