How can I create a cross-browser pure CSS flip animation?

问题

So I've created a CSS flip animation. My problem is, that it looks totally different in latest browsers of Chrome, FF, and IE. How should I modify the css, to work perfectly in these modern browsers? Thanks!

Here is the working example:

jsfiddle

来源：https://stackoverflow.com/questions/26465632/how-can-i-create-a-cross-browser-pure-css-flip-animation