解决 Safari 中基于视窗的流体排版 Bug

Avatar of Chris Coyier
Chris Coyier

DigitalOcean 为您旅程的每个阶段提供云产品。 立即开始使用 200 美元的免费积分!

Sara 深入探讨了一个我 曾经提到过 的 Bug,即流体排版在浏览器窗口大小改变时不会调整大小。 当时,它影响了 Chrome 20 和 Safari 6,但即使在 calc() 涉及视窗单位的情况下,该 Bug 如今依然存在于 Safari 中。

Sara 将此归功于 Martin Auswöger 的一个非常奇怪且 巧妙的技巧,该技巧使用 -webkit-marquee-increment: 0vw; ( 这是 文档 ) 来强制 Safari 采用正确的行为。 我将制作一个屏幕截图来记录它。

我碰巧打开了 Safari Technology Preview,目前是 Safari 15,我发现该 Bug 已经修复。 所以,我不会急于实施这个解决方案。

直接链接 →