WebKit：有没有任何css技巧可以将元素放到前面而不缩放它？

Question

从图片中，我使用rotate3d（）到红色矩形，所以它的一半在黑色矩形的前面而另一个在后面。

我希望黑色矩形位于红色矩形的前面，所以我必须使用translateZ（），因此它变为

问题是我希望黑色矩形在前面而不缩放它。我想要黑色矩形仍然是相同的大小。有什么伎俩吗？我尝试了z-index但它没有用。我猜是因为我使用了rotate3d（）。

提前致谢。

Answer 1

我目前无法访问Safari进行测试，因此我将其留给您（让我知道它是否有效），但我相信以下内容应该有效。

由于-webkit-perspective的浏览器解释似乎是I noted in my answer to this question的问题，请将其从#container中移除并将其替换为-webkit-transform: perspective(500)，然后添加相同的内容（{{ 1}}）-webkit-transform: perspective(500)和#parent，这就是我所做的in this fiddle。

问题似乎是，在使用#parent2时，Safari不会对#container应用透视，而Chrome会使用。{1}}。正如我在回答the other question时所讨论的那样，这似乎是对规范的解释问题。