CSS3 rotate - проблемы с рендерингом в Firefox и Safari

Я пытаюсь повернуть простую строку текста на несколько градусов с помощью свойства CSS3 "rotate", точно на 1,5 градуса.

  -webkit-transform: rotate(1.5deg);
  -moz-transform: rotate(1.5deg);
  -ms-transform: rotate(1.5deg);
  -o-transform: rotate(1.5deg);
  transform: rotate(1.5deg);

Результат в Chrome (v18) выглядит нормально, в Firefox (v10) и Safari (5.1.5), однако я получаю уродливые результаты.

Я использую шрифт, реализованный с @font-face, но с Arial у меня все еще возникают проблемы (по крайней мере, в Firefox). См. Примеры ниже.

Что действительно странно в том, что переключение на системный шрифт (Arial) в Safari устраняет проблему, в то время как в Firefox проблема сохраняется.

Приветствуется любая помощь, обходной путь или взлом.

1) Chrome 18/font-family: Calibri/alignment OK

2) Firefox 10/font-family: Calibri/alignment уродливый

3) Firefox 10/font-family: Arial/выравнивание все еще уродливое

4) Safari 5.1.5/font-family: Calibri/выравнивание уродливое

5) Safari 5.1.5/font-family: Arial/alignment OK

До сих пор я нашел следующие темы, но ни один из них не дает объяснений, как решить проблему:

https://bugzilla.mozilla.org/show_bug.cgi?id=403447

Ошибки CSS3 - Проблемы при использовании transform: вращение правил (Safari + Firefox)

Преобразование CSS Поверните выравнивание букв

Я также попытался установить переменные DirectWrite (для изменения рендеринга шрифтов), как описано в этом уроке: http://www.askvg.com/how-to-enable-direct2d-directwrite-hardware-acceleration-in-mozilla-firefox/, но результаты те же.

Ответ 1