html - 使用 CSS 变换缩放打破位置 :fixed

Question

我遇到了一个奇怪的问题，想知道它是否是渲染引擎中的错误 - 它出现在我测试过的 WebKit 和 Firefox 中。

如果您有一个固定在页面上的 div 并且您在其中添加另一个 div 并将其设置为固定的(以在固定的范围内获得固定的标题弹出窗口)，您可以确保标题将保持可见，即使用户滚动弹出窗口。除非你在弹出窗口上设置 transform scale - 这样做会破坏 position:fixed 并导致它不再固定到父级的顶部div 而不是它会随着内容滚动。这是预期的行为 - 我该如何解决？

JSFiddle

Answer 1

好吧，transform: scale(x) 会将元素从坐标流中分离出来，因此无法拥有固定位置。

我建议用 overflow: auto 将 #header 下的文本包装在受约束的 div 中。 fixed 祖先的 fixed 子级没有多大意义，但我明白你想要什么。