仅在带动画的Firefox上使文本模糊

Question

尝试获取清晰的文字。 这段代码在chrome / IE上显示的是纯文本，但在Firefox上却不能显示，这出于某些原因使我看不清文本。

这是我的问题的再现：https://jsfiddle.net/z7egrnod/

有人能解决这个问题吗？我只是不明白怎么可能会有模糊的文字。

.skewContent {
height: auto;
-o-transform: skewY(-6deg);
-moz-transform: skewY(-6deg);
-ms-transform: skewY(-6deg);
-webkit-transform: skewY(-6deg);
transform: skewY(-6deg);
transform-origin: top left;
overflow: visible;
}

.skewContent#toolbox {
    margin-top: -110px;
    outline: 1px solid transparent;
}

.containerSkew .skewFix {
-o-transform: skewY(6deg);
-moz-transform: skewY(6deg);
-ms-transform: skewY(6deg);
-webkit-transform: skewY(6deg);
transform: skewY(6deg);
}

chrome上的图片示例：

firefox上的图片示例：