位置粘滞不适用于表中的水平滚动。

Question

我试着用水平卷轴来制作表格，它可以冻结列，现在我试着冻结一个单元格进行测试，但是它不能按预期工作。

这是我用来冻结我的手机的代码：

element.style {
    position: sticky !important;
    z-index: 1000;
    top: 0;
}

这样，单元格就不会冻结，整个表格从左向右移动。我找到了这个https://plnkr.co/edit/l0m9pF3His2BrKjS?preview，并试图在我的项目中重新创建该解决方案。

有人知道为什么我不能把这个牢房冻在原地吗？

如果我使用垂直滚动，单元格将保持在其他元素的顶部，因此z-index: part可以工作。

Answer 1

您必须定义left或right，才能使其在水平方向粘稠。

工作示例：

​

* {
    margin: 0;
    padding: 0;
}

div {
    width: 200vw;
    height: 100vh;
}

span {
    position: sticky !important;
    z-index: 1000;
    top: 0;
    left: 0;
}

<div>
    <span>STICKY SPAN</span>
    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
</div>

​