让引导卡在 Safari 中翻转

Question

我的 Bootstrap Card 有点问题，让它在 Safari 中翻转，在所有其他浏览器中都可以正常工作，但是当谈到 Safari 时，它似乎不想玩球。

Here is my code: http://codepen.io/go6/pen/ONrBeR

如您所见，它只是一张卡片，上面有两个充满内容的面孔。在 Chrome 等中翻转绝对没问题。

我尝试过在 safari 中旋转它的度数，例如，如果将它旋转到 179 度和 181 度，你会看到一半的卡片。但是在它应该在的 180 度时，它会出现一秒钟，然后再次消失。

所以我只是想问一下我是否需要做任何具体的事情才能使这项工作在 safari 中发挥作用。

提前致谢！！

Answer 1

我认为这是因为父元素 .panel 的背景颜色。当我从中删除背景颜色并将其添加到 .face 时，它对我有用。

想象一下，它就像一个透明盒子（面板），您将另外两个（正面、背面）放入其中。现在你画外箱（面板）的背面并翻转它。当然，您再也看不到包含框（正面、背面）了。

总结一下：包含框（面）位于其父级（面板）背景的后面。所以让父级保持透明并为包含的框着色。