如果某些列在某些浏览器中是固定的，为什么 table headers 和 Ant table 中的数据重叠？

Question

使用 Ant table 设计 构建具有许多列的 table 结构。前 3 列固定在此处。对于这些固定列，table headers 和数据会正确显示。但对于余额列，即使在滚动时 headers 和数据也会重叠。这种情况在 chrome 和 safari 中都会发生，但不会在 Firefox 中发生。 Firefox 似乎工作正常。

我当前的css代码，

   .ant-table th {
      line-height: 1;
      text-align: right;
      padding: 15px 9px;
      overflow-wrap: normal;
      white-space: nowrap;
    }

Answer 1

table-layout:fixed 由 firefox 正确处理。但其他浏览器 chrome 和 safari 则不行。更改 table-layout:auto 将解决此问题。

.ant-table-layout-fixed table {
    table-layout: auto;
}

如果某些列在某些浏览器中是固定的，为什么 table headers 和 Ant table 中的数据重叠？

Why does table headers and data overlap in Ant table if some columns are fixed in some browsers?

firefox

google-chrome

tablelayout

reactjs

antd