CSS「回転を変換するには、」私はCSSでこれをやった成果物

Question

を作成します。

これは、追加した後、GoogleのChromeで素晴らしい作品：

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

をしかし、Firefoxでは、それは次のようになります。

source here

Iトンを参照してください。いくつかのことを掘り起こし、多くを探しました。私は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を参照してください。