我有一个网站,它是根据这篇A List Apart帖子中描述的"圣杯"布局设计的。最近的Chrome更新打破了它。您可以在文章的示例页面上看到结果(我也把它变成了小提琴(。在Firefox中打开它,看看它应该是什么样子,在Chrome中打开它,看看现在发生了什么。
我意识到这种技术已经过时了,我计划使用 Flexbox 重新设计它。但是,这需要时间,我希望在我重新设计的同时让它快速恢复工作。您可以在此页面上阅读有关LayoutNG的更多信息。
有谁知道解决这个问题的任何提示和技巧?是否有我可以关注的 Chrome 错误已经打开?
更新:我决定在金丝雀(v79(中对其进行测试,并且布局在那里完美运行。不过,它在测试版(v78(中仍然被破坏了。所以,我可以等到当前的金丝雀发布,但根据目前的估计,这要等到 12 月。因此,如果有的话,我仍然希望从现在到那时找到快速解决方案。
这里有一些让SO开心的代码:
SO won't let me post a link to jsFiddle without code...smart
事实证明,使用Flexbox重新实现布局并不难。因此,我只是做了一些很好的老式用户代理嗅探来检测损坏的Chrome版本并加载一个小的CSS片段来覆盖适当的样式。