带有位置“固定”在iframe中的元素不在Safari中呈现
问题描述：
我们遇到问题，其中iframe中的position: fixed;元素未呈现正确。我们只在Safari的macOS上注意到这一点。带有位置“固定”在iframe中的元素不在Safari中呈现
下面是它应该如何看：
这里是Safari浏览器在Mac OS看起来像（在页面加载）：
在页面加载的顶部和底部酒吧不可见。它们在DOM中占据空间并且可以被点击，但是它们没有被浏览器“渲染”。正如你在上面的图片中看到的那样，条形显示为空白。
如果我们强制通过JS，CSS重新绘制或通过调整浏览器大小将出现条。然而，我们并没有寻找如何强制重绘的解决方案。我们的问题是为什么这首先发生？
你可以在这里找到一个活生生的例子：
https://testing.enuvo.ch/user/collect/#collector#/user/overlay
PS：这并不总是发生。有时，在调整浏览器大小并再次尝试时，它会正确显示。我们希望你能重现这个问题。
答
我试过你的例子，是的，这真的很奇怪。 你有没有想过缓存问题？ Safari有缓存iframe的独特行为，也许你的问题来自这些。
您可以尝试更改此iframe的HTTP标头以禁用像这样的缓存吗？
Cache-Control: no-cache, no-store, must-revalidate Pragma: no-cache Expires: 0
这里是PHP的例子：
header('Cache-Control: no-cache, no-store, must-revalidate'); // HTTP 1.1.
header('Pragma: no-cache'); // HTTP 1.0.
header('Expires: 0'); // Proxies
答
所以有一些故障position: fixed和z-index。一些较旧的浏览器对待它有点不同，并以不同的方式处理堆叠上下文。
有点试验和错误之后，我已经成功加入让它与注入样式表的工作：
#ol-main-header,
#cl-footer {
-webkit-transform: translateZ(0);
}
你也应该能够去除unnecesarry z-index: 99999。希望有所帮助。
不确定在重绘但我想指出的问题，您的noscript块呈现您喂它的文本的标签。 – abluejelly
@abluejelly感谢您的通知。当我们将源代码复制到这个测试服务器上时（为了让您可以访问它），这一定是发生了。 – Lionel