滚动 div 高度后 CSS Sticky 标题消失

Question

编辑：问题已修复。不幸的是，我在此处发布的代码中没有任何内容，因此发布答案并没有多大用处。这是一个框架问题。

正如标题所暗示的那样，通过在我的 CSS 中使用 position: sticky;，我有一个带有粘性 <thead> 的 div（带有一个表格）。但是在滚动 div 高度后，标题只会随着内容向上滚动。

html代码是这样的

<div class="tablewrapper">
    <table>
        <thead>content with tr and th's</thead>
        <tbody>more content with tr and td's</tbody>
    </table>
</div>

我的 CSS 代码是这样的：

.tablewrapper {
    overflow: auto;
}

.tablewrapper table {
    /* This is empty */
}

.tablewrapper thead {
    display: block;
    position: sticky;
    overflow: visible
}

.tablewrapper tbody {
    overflow: visible;
    display: block;
}

滚动条来自.tablewrapper。

如何让thead 保持粘性？

另外，澄清一下，代码比这里先进得多，所以不幸的是我不得不在tablewrapper 上使用滚动条。

最好使用纯 CSS 修复

Answer 1

添加Top: 0;，当thead标签到达顶部时会粘住

.tablewrapper thead {
  display: block;
  position: sticky;
  Top:0;
  overflow: visible
}