Css iOS/iPad+；Safari：垂直和水平放置的粘性细胞，显示抖动效果

我有一个表，不是HTML表，而是一个由React样式的div组成的表，其中最上面的4行单元格是粘性的，当通过垂直滚动访问相应的数据集时，第2、第3和第4行单元格也被它们的替换项替换，如gif所示，这就是为什么不能使用“固定”位置的原因。如图所示，此表的前两列也由粘性单元格组成，用于在固定这两列的情况下进行水平滚动

问题是当在iPad中水平滚动时，位于左上角的8个单元格会从它们的位置水平移动一点，并且在滚动（或触摸，如果是iPad）被释放时会重新定位，这会产生不良影响。然而，这种影响在iOS Safari上是很小的，在Chrome/FF中可以正常工作

下面是其中一个左上角单元格的css：

.efVzif.efVzif {
    white-space: pre-wrap;
    vertical-align: text-top;
    overflow: hidden;
    text-overflow: ellipsis;
    background-color: var(--background-white);
    display: inline-block;
    font: var(--typography-body3);
    -webkit-letter-spacing: var(--label-typography-letter-spacing);
    -moz-letter-spacing: var(--label-typography-letter-spacing);
    -ms-letter-spacing: var(--label-typography-letter-spacing);
    letter-spacing: var(--label-typography-letter-spacing);
    color: var(--black);
    text-transform: none;
    width: 160px;
    height: calc(100% - 2px);
    position: -webkit-sticky;
    left: 156px;
    /* right: 0px; */
    z-index: 2;
    padding: 5px 10px 0 10px;
    text-align: left;
    box-shadow: 8px 0 5px -3px rgba(133,146,166,0.2);
}

---

您是否尝试过将

overscroll行为

更改为

none

？如果没有，请将其添加到CSS中，看看是否有帮助

body {
    overscroll-behavior: none;
    overscroll-behavior-y: none;
    webkit-overscroll-behavior: none;
    webkit-overscroll-behavior-y: none;
}

---

谢谢你的回答。但不幸的是，它并没有起作用，而且Safari浏览器似乎也不支持overscroll行为