CSS3旋转翻转卡-闪烁?

qwe*_*rty 6 transition rotation flicker css3

请参阅此页面上的灰色框:http : //goo.gl/fL973

悬停时,它应该翻转并显示另一侧。它可以在Chrome浏览器中使用,但是由于某些原因,动画播放期间会出现很多闪烁。我尝试摆弄规则,甚至在盒子周围添加一个容器,但没有成功。

我阅读了以下问题,其中包括:为什么Chrome中的rotateY(翻转)css3动画闪烁?

问题似乎在于具有的元素backface-visibility: hidden;不能具有背景。所以,作为一种解决方法,我想我可以有一个元素中.front.back,并给该元素的背景。那没有用,仍然闪烁。

除此之外,我也不确定为什么它只能在Chrome / webkit中使用。我确实为所有内容都添加了必要的前缀,因此它应该可以工作,不是吗?

有什么建议么?

qwe*_*rty 5

backface-visibility: hidden;移至.front.back而不是后,效果很好.card。忽隐忽现。现在,我只需要针对不支持的浏览器提出一些建议。