Смазывание текста, когда используется анимация

#html #css

Есть текст, расположенный вертикально

Повернут с помощью transform: rotate(90deg);



Все хорошо, но когда на странице появляется анимация

То текст смазывается - 



Как с этим бороться?
    

Ответы

Ответ 1

Такое поведение есть в некоторых браузерах (в Хроме, например), некоторые вроде как
от этого избавились, но общего решения для этой проблемы нет. Причина же таких визуальных
эффектов в том, что вы анимируете свойство transform — что, кстати, наиболее правильно
— а такая анимация происходит отдельным слоем на GPU и с субпиксельным сглаживанием,
и именно от применяемого алгоритма в браузере для этого сглаживания зависит будет замыливание
или нет.