当我将position: sticky; top: 0添加到表的<thead>元素中时，<thead>在其自身与表元素的顶部之间有一个奇怪的间隙，我无法消除。
Pic of the weird space
编辑：也发生在email protected(https://stackoverflow.com/cdn-cgi/l/email-protection)（18614.2.9.1.12），但不是奇怪的差距是在头部的顶部，它在底部（见图片）：Weird gap viewed on Safari
对于上下文，这是通过email protected(https://stackoverflow.com/cdn-cgi/l/email-protection)项目运行的，通过运行Ventura 13.0.1的M1 Mac上的Chrome（版本120.0.6099.109 Official Build -arm 64）访问
对于上下文，这里是我应用到我的表的样式（但是如果我删除位置，问题就消失了：sticky -不能弄清楚如何让它消失，同时仍然有标题坚持/如果有人对此有任何上下文）：

/* article table styling: */

.disc-story-article figure.table {
  display: flex;
  flex-direction: column-reverse;
  max-width: 98%;
  max-height: 80vh;
  overflow: scroll;
  margin: 0;
  border: 0.22rem solid var(--primary-color);
  border-radius: 1rem;
}

/* article table overall styling */

.disc-story-article figure.table table {
  border-spacing: 0;
}

/* article table caption styling */

.disc-story-article figure.table figcaption {
  display: flex;
  align-self: center;
}

/* THIS !! article table header styling: */

.disc-story-article table thead {
  position: sticky;
  top: 0;
}

/* article table header row styling: */

.disc-story-article table thead tr {
  color: var(--background);
  background-color: var(--secondary-color);
}

/* article table right-most column cell styling */

.disc-story-article table tr td:nth-last-child(1),
.disc-story-article table tr th:nth-last-child(1) {
  border-right-width: 0 !important;
}

/* article table bottom-most row cell styling */

.disc-story-article table tr:nth-last-child(1) td {
  border-bottom-width: 0 !important;
}

/* article table general cell styling: */

.disc-story-article table td,
.disc-story-article table th {
  border-top: none !important;
  border-left: none !important;
  border-right: 0.12rem solid var(--primary-color) !important;
  border-bottom: 0.12rem solid var(--primary-color) !important;
  padding: 1rem;
}

个字符
尝试使用margin/padding/border等.没有效果。还尝试使用transform/translates来查看它是否会消失（例如Remove unwanted space with position sticky）似乎不是Google/SO上的超级公开问题，或者可能我只是错过了它