我有一个固定的标题元素，我想在滚动时保持固定。然而，我希望可滚动区域直接定位在固定元素之后，但我不想使用 position: absolute 并将其从文档流中删除。
我创建了一个 Codepen here来说明我遇到的问题。我希望红色元素 (.top) 保持在滚动条上，而不隐藏第一个列表项。
有没有办法在不需要任何 JS 的 CSS 中(可能使用 flexbox)做到这一点？
感谢任何帮助。
提前致谢!
最佳答案
如果我对您的问题的理解是正确的，您希望不做任何更改，除了可滚动内容不会隐藏在固定标题后面。
固定 header 似乎自然高度接近 20px。
因此，您可以将上边距应用于可滚动内容，将其从顶部向下推，直到它清除标题。
尝试将此添加到您的 CSS:
div.list { margin-top: 20px;}
这会将包含所有列表项的 div 从顶部推到 20px。
演示:http://codepen.io/anon/pen/EVWYJd
更新
当固定标题的高度已知时，上面的答案有效。但根据评论中的反馈，标题的高度有所不同。因此，需要一种解决方案，无论标题的高度如何，都将可滚动内容保留在标题下方。
此问题已在这些帖子中得到解决:
关于html - 将元素粘贴到固定元素的底部，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32891538/