Question

I am rendering text in the reverse, the below code works like a champ. The issue is IE, the fonts are all rendered with VERY jagged edges. Anyone have a suggestion as to how to make it render properly in IE?

.flipText {
display: block;
-moz-transform: scaleX(-1); /* Gecko */
    -o-transform: scaleX(-1); /* Opera */
    -webkit-transform: scaleX(-1); /* webkit */
    transform: scaleX(-1); /* standard */
    filter: FlipH; /* IE 6/7/8 */
-ms-filter: "FlipH";
}

Answer 1

By adding a background-color the elements containing the actual text, I was able to “mask” the effect being rendered in IE. ()..