我有一个有大量弹出窗口的应用程序，我将它们定位如下：
.popup {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
但有些弹出窗口模糊不清。这种转变：翻译是什么杀死它。据我所知这是chrome问题，但解决这个问题的最佳方法是什么？
这不是代码中的错误，这是众所周知的Webkit呈现错误。请参阅示例：https://support.mozilla.org/pl/questions/1075185（以及FF支持论坛上的更多主题）。
在Chrome和FF中，在高级浏览器设置中，您可以关闭所谓的“硬件加速”。此设置用于让您的硬件在进行高级图形渲染时“帮助”浏览器。对于您使用翻译的元素和其他一些规则，硬件加速会自动打开。实际上，有时候经验丰富的“超级css黑客”会使用它来在某些情况下实现更好/更清晰的渲染。
但有时它会导致更糟糕而不是好事，这就是你的情况。在浏览器中关闭硬件加速后，字体非常清晰。可悲的是，代码没有真正的解决方案，你不能强迫它为给定的元素关闭。我们依赖于Webkit开发人员在这里修复渲染引擎。你只能乱砍，例如将字体大小更改为一个没有真正原因渲染效果更好的字体。或者以某种不涉及翻译的方式改变定位。祝你好运。