位置：固定不在铬22工作 [英] position:fixed not working in chrome 22

问题描述

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

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

有人知道发生了什么事，是原因吗？解决方案您的问题很可能是由于Chrome重新编辑位置：fixed 元素处理 z-index 的堆叠。改变是为 Chrome v22 所做的，所以如果你在v21上构建并且使用 position：fixed ，你可能会遇到问题。

他们建议通过在浏览器中点击Chrome特殊网址 about：flags 进行测试，并将固定位置元素创建堆叠上下文。为true（对于v22 +）或false（对于v21）。

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

• 堆叠变化到位：固定元素
  
• 详细描述堆叠上下文

i'm new with html5 and css3. I released my first website last month and now i found out that it's not working well in the new chrome version (22): All the fixed elements are no longer fixed... The navigation bar on the top of the screen for example. it was fine only a week ago and i have no idea why now it's not. This is the website: www.biofilter.co.il

As far as i can tell, it's still working fine in Firefox and IE.

Does anyone has an idea what's going on and what could be the reason?

解决方案

Your problem is likely caused by Chrome reworking how position:fixed elements handle stacking of z-index. The change was made for Chrome v22 so if you built on v21 and use position:fixed, you might have a problem.

They suggested testing by hitting the Chrome special URL about:flags in the browser, and setting Fixed position elements create stacking contexts. to true (for v22+) or false (for v21).

It is possible to rework your CSS by ensuring position:fixed elements are stacking correctly. Unfortunately, it is a little complicated so recommend you read these for better explanation:

• Stacking changes coming to position:fixed elements
• Elaborate description of Stacking Contexts

这篇关于位置：固定不在铬22工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！