【发布时间】：2023-04-04 17:21:01
【问题描述】：
我有一个打开的对话框窗口，它有一个可调整大小的宽度和一个可引发滚动的最大高度。我想在此对话框的顶部放置一个 div（或多个元素，如有必要），这样当我滚动时，该 div 仍然可见。我还希望 div 的宽度能够填充对话框的宽度。
所以，我从一些基本的 HTML 标记开始：
<div id="dialog">
<div id="dialogHeader"><div>
<div id="dialogContents"></div>
</div>
此时，dialogHeader 的宽度会自动缩放以适应对话框的宽度。但是，如果我向下滚动 dialogContents，dialogHeader 会滚动出视口。
当使用“位置：固定；”标记 dialogHeader 时，我遇到了相反的问题现在，它仍留在视口中，但其宽度缩小到其内容的宽度。
如果我将 dialogHeader 的宽度设置为 100%，那么它会扩展到对话框之外。
有什么诀窍可以实现这两种效果吗？还是我需要使用jQuery监控对话框的宽度并自动调整dialogHeader的宽度？
这是一个屏幕截图，显示我的元素位于对话框顶部，其位置设置为固定。请注意，您可以看到绿色背景没有覆盖整个顶部。
【问题讨论】：
-
是的。该对话框有一个滚动条。我在场景的屏幕截图中进行了编辑。
-
你能把滚动条放在内容 div 上而不是外层 div 上吗？
-
可能。我只是认为这将是阻力最小的路径，因为在此应用程序中的所有对话框的对话框级别设置了最大高度。限制对话框子集中的内容高度可能会导致潜在的双重嵌套滚动条/其他不规则行为......只是好奇是否可以先这样。 :)
标签： javascript html css