html - 卡住表中最左边的列

Question

我有一个相当大的表，我用它来安排 html 中的时间，我想卡住左边的列。

我原来的 CSS 是这样的:

table, th, td {
   border: 1px solid black;
    border-collapse: collapse
} 
td {
    min-width: 35px;
    width: 35px;
    text-align:center;
}
td.name{
    min-width: 150px;
    width: 150px;
    text-align:left;
}

我把它调整成这样:

table, th, td {
   border: 1px solid black;
    border-collapse: collapse
} 
td {
    min-width: 35px;
    width: 35px;
    text-align:center;
}
td.name{
    min-width: 150px;
    width: 150px;
    text-align:left;
    Position:fixed;
}

希望这会在滚动过程中卡住左列。相反，我得到了重叠的行，虽然它确实卡住了滚动文本，但在卡住的行后面是可见的。

例子: https://jsfiddle.net/780r86qL/

我该怎么做才能解决这两个问题？

Answer 1

添加背景:白色；

https://jsfiddle.net/780r86qL/2/

table, th, td {
border: 1px solid black;
border-collapse: collapse;
background: white;
}