在父元素上使用變換時的Chrome文本渲染

Question

我對div元素有一個非常簡單的變換。它的內部是幾行文字。文字在Firefox和IE上呈現良好，但在Chrome中看起來不太好。我試着改變-webkit-font-smoothing，但那也沒有幫助。

.text-holder{position: absolute;top: 0;width: 30rem;height: 20rem;margin-right: auto;margin-left: auto;left: 0;right: 0;-webkit-transform:rotate(-4.6deg);-moz- transform:rotate(-4.6deg); transform: rotate(-4.6deg);} 

這裏是小提琴： http://jsfiddle.net/FFA6b/

Answer 1

這很難解釋爲什麼，但增加的角度來解決這個問題：

-webkit-transform: perspective(999px) rotate(-4.6deg); 

fiddle