溢出的细胞无法保持平板电脑的颜色

Question

我的桌子上有一个错误，你可以在这张图片上看到：

每一行都有一种颜色（这里都是绿色）但是带有溢出（滚动）的单元格似乎在保持单元格的颜色方面存在问题。 你可以注意到一些奇怪的东西：颜色在桌子下方（“Légende”按钮所在的位置）。

我的CSS的一部分：

table {
    table-layout: fixed;
    width: 100%;
}

table tr td{
    overflow: scroll;
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
}

td::-webkit-scrollbar-thumb {
    -webkit-border-radius: 2px;
    -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.5);
    background: transparent;
}

td::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255,255,255,0.3);
}

td::-webkit-scrollbar-track {
    background: transparent;
    border: 0;
}

::-webkit-scrollbar-corner {
    background: transparent;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-thumb:hover {
    background: #838383;
}

::-webkit-scrollbar-thumb:active {
    background: #6a6a6a;
}

tr {
    background-color: rgb(xx, xx, xx);
    display: tabl-row;
}

你知道我的CSS或bug是否有问题，因为我在一个较小的屏幕上（平板电脑，使用Chrome）。笔记本电脑屏幕也没有问题（Chrome也是如此）。

Answer 1

直接溢出滚动不能应用于td标记。因此，使用在td标记内设置的overflow：scroll属性嵌套块级div。像这样：

<td><div style="overflow:scroll;">Content</div></td>

您可以参考此Similar problem here