html - CSS position:sticky 在一个 div 中堆叠两个元素

我将尝试以尽可能清楚的方式解释我的问题。

我们正在使用基于 Web 的 ERP，当您访问销售订单文档时，您会看到顶部带有状态栏的表单视图（显示文档的当前状态以及一些用于执行某些操作的按钮）以及文档中包含销售订单行的表格。

问题是某些引用太大，向下滚动时表格的标题会丢失。我面临很多麻烦尝试仅使用 CSS 将表格的标题卡在顶部。

这是源代码的片段：

如果我将标题位置设置为粘性并向下滚动，我得到的是：

如您所见，它位于状态栏下方。我希望它坚持下去。但是我不知道如何定义一个从状态栏底部到视图末尾的 div，这样标题就会粘在那里。

我知道我可以将标题的“顶部”属性设置为状态栏的确切高度，但是如果上面有很多内容，这个属性可以改变，就是这样，它是一个动态高度。

这是div结构：

如果需要，我可以提供一个 html 文件。

预先感谢您的任何帮助！

标签： htmlcssheadersticky