CSS＆＃39;变换旋转＆＃39;创建工件

Question

我已经在CSS中完成了这项工作。

添加以下内容后，它在Google Chrome中运行良好：

-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;

但在FireFox中它看起来像这样：

请参阅source here

我尝试了几件事并进行了大量搜索。我不知道如何摆脱FireFox创造的边界。我找到的大部分内容都是关于转换的，我不会使用它。任何想法都会非常受欢迎。

参考文献：
- CSS3 transform rotate causing 1px shift in Chrome
- -webkit-transform rotate - Pixelated images in Chrome
- CSS transition effect makes image blurry / moves image 1px, in Chrome?

Answer 1

在轮换规则之前添加translateZ(1px)似乎会删除这些工件：

transform: translateZ(1px) rotate(-45deg);

请参阅this question。