I'm having a problem with the back face-visibilty property. It works how I want it to in Safari/Chrome, but for some reason it's not working correctly in Firefox.
When the box flips, I get a mirror image of the front face.
This bug has been acknowledged by Mozilla.
The fix is to add transform: rotateX(0deg) to the front and back objects.
Adding backface-visiblity:hidden on the container, as suggested by @yalia, makes the back unresponsive in Chrome, hence that fix should be avoided.
Here's a fiddle with the fix.
Try putting 'backface-visibility:hidden' both on the object and its container. This is what worked for me with this bug
来源：https://stackoverflow.com/questions/9604982/backface-visibility-not-working-properly-in-firefox-works-in-safari