РЕДАКТИРОВАТЬ 2016-07-04 (Поскольку этот вопрос становится популярным): это ошибка в Chrome. Разработчики активно работают над исправлением.
РЕДАКТИРОВАТЬ 2017-05-14 Ошибка, кажется, исправлена, исправление будет введено в Chrome 60
РЕДАКТИРОВАТЬ 2018-05-04 Исправление было объединено, но ошибка все еще, кажется, присутствует.
Итак, у меня есть это очень уродливое окно, которое центрируется на экране этим CSS:
.popup
{
position: fixed;
top: 0;
bottom: 0;
transform: translate(-50%, -50%);
}
Однако в Chrome это выглядит так (шрифт выглядит очень размытым):
Но вот так на Firefox:
Когда я удаляю правило transform
, текст снова выглядит красиво и хрустяще, но затем он переставляется по центру.
Когда я перехожу к chrome://flags
и выполняю #disable-direct-write
это выглядит лучше, но пользователи, очевидно, не собираются этого делать, и это не решает проблему.
Как сделать так, чтобы мой шрифт выглядел красиво, при этом окно было по центру?
Моя версия Chrome 44.0.2403.155
У меня есть демонстрация three.js
с использованием WebGL, которая отображается на фоновом холсте. Когда я отключаю демо, проблема больше не возникает.