Css Chrome中的模糊文本，有任何修正吗？

我有一个有大量弹出窗口的应用程序，我对它们的定位如下：

.popup {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

---

但有些弹出窗口很模糊。这种转变：翻译是扼杀它的东西。据我所知，这是chrome的问题，但最好的解决方法是什么

这不是代码中的错误，这是众所周知的Webkit渲染错误。请参阅示例：（以及FF支持论坛上的更多线程）

在Chrome和FF中，在高级浏览器设置中，您可以关闭所谓的“硬件加速”。此设置用于在高级图形渲染时让您的硬件“帮助”浏览器。对于使用“平移”和其他一些规则的元素，“硬件加速”会自动启用。在某些情况下，缺乏经验的“超级css黑客”有时会使用这种方法来实现更好/更清晰的渲染

---

但有时它造成的坏的比好的多，这就是你的情况。在浏览器中关闭硬件加速后，字体将非常清晰。遗憾的是，在代码方面没有真正的解决方案，您无法强制关闭给定元素的解决方案。我们依赖于Webkit开发人员在这里修复渲染引擎。您只能随意改变，例如将字体大小更改为一个没有真正原因的更好的字体。或者以不涉及翻译的方式改变定位。祝您好运。

您可以在.css中尝试此功能：

.myfont{
-webkit字体平滑：抗锯齿；
-moz osx字体平滑：灰度；
}

请使用HTML显示JSFIDLE。可能尝试3d翻译，也可能以不同方式呈现：）可能重复的