html - 在固定的 div 内固定一个 div 以防止滚动时移动

Question

我创建了一个几乎填满屏幕的弹出窗口，并且这个弹出窗口是固定的，因此当用户滚动主页时​​它会保持在屏幕中央。但是这个弹出窗口也是可滚动的，我在它的顶部有一个标题，我希望它始终可见。

如何修复标题，使其在弹出窗口滚动时始终可见？

似乎如果你设置 position:fixed 这总是相对于浏览器视口(viewport)，因此它会固定在页面的顶部而不是它的父容器。这是 Webkit 中的粘性定位任务，还是如何实现？

JSFiddle demonstrating the issue - 当我想要修复时，滚动蓝色弹出窗口和黄色标题滚动。

Answer 1

将 #header 的 CSS 样式更改为以下内容:

#header {
    position:fixed;
    width: inherit;
    height:2em;
    background-color:yellow;
}

工作 fiddle here