我在使用 WebKit 时遇到了一些非常奇怪和棘手的问题。我正在玩一个 CSS 动画，其中一个 div 围绕 Y 轴旋转，而背景中的另一个 div 什么也不做。问题是，在 Safari 中，正在旋转的 div 会被第一个 div 剪切，而不是在其顶部旋转。
这有点难以解释，所以这里有一个 JSfiddle。 http://jsfiddle.net/HMF6f/
有人提到添加 3d 翻译可以修复它（如下所示），但在复杂动画的情况下，这完全改变了视觉外观，这对我不起作用。
-webkit-transform: translate3d(0, 0, 100px) rotateY(-50deg);
我喜欢 Chrome 的行为方式，我希望有同样的行为。关于如何实现这一目标的任何想法？