位置：固定在 chrome 22 中不起作用

【问题标题】：position:fixed not working in chrome 22位置：固定在 chrome 22 中不起作用
【发布时间】：2013-06-12 19:41:30
【问题描述】：

我是 html5 和 css3 的新手。我上个月发布了我的第一个网站，现在我发现它在新的 chrome 版本 (22) 中运行不佳：所有固定元素都不再固定...例如屏幕顶部的导航栏。一周前还好，我不知道为什么现在不行。这是网站：www.biofilter.co.il

据我所知，它在 Firefox 和 IE 中仍然可以正常工作。

有没有人知道发生了什么以及可能是什么原因？

【问题讨论】：

Chrome是最近开发的，我觉得新版的Chrome和你现在的版本不兼容。
我知道 z-index 在 chrome 22 中的工作方式不同，但这不是我网站的问题。位置：固定根本不起作用......
也许另一条规则会覆盖您关于职位的规则。试试 !important 让我知道结果如何。
我试过了，但 !important 并没有改变任何东西......一周前我的网站代码是相同的，并且在 chrome 中一切正常。我几乎可以肯定它与新的 chrome 版本有关。
是的，我和你有同样的问题。还是不知道怎么解决。

【解决方案1】：

您的问题可能是由于 Chrome 重新设计了 position:fixed 元素处理 z-index 的堆叠的方式。更改是针对 Chrome v22 进行的，因此如果您在 v21 上构建并使用 position:fixed，您可能会遇到问题。

他们建议通过在浏览器中点击 Chrome 特殊 URL about:flags 并将 Fixed position elements create stacking contexts. 设置为 true（对于 v22+）或 false（对于 v21）进行测试。

可以通过确保position:fixed 元素正确堆叠来重新设计您的 CSS。不幸的是，它有点复杂，所以建议您阅读这些以获得更好的解释：

【讨论】：