材质UI表格单元格相同的固定宽度

Question

我下面有一个材料UI表。该表格的所有列均适合205px。桌子本身设置为100％宽度。因此，当我加载页面时（如果有可用的空间表）会变得更大。问题是，如果没有足够的空间列需要根据其内的文本进行收缩，而它们却没有。它们被固定在205px的宽度上。

我也删除了所有填充物也没有帮助。每个单元格中的文本是一个输入字段，因此，如果我将输入字段的宽度设置为60px，所有单元格的宽度都将减小到191，但仍使每个单元格的宽度超出其所需的宽度，因此列的长度将超出其应有的范围。我更改了表格的宽度，容器的宽度全部无济于事。

我有非常精确的表结构，如此处的示例所示； https://codesandbox.io/s/github/tannerlinsley/react-table/tree/master/examples/material-UI-enhanced-table

如果在此示例中您也看到表格列不必要地太大。是什么导致列比所需的大得多？为什么它们全部都固定到一定大小？

Answer 1

表单元格中的输入具有默认宽度，并使列不可收缩。将输入宽度更改为100％可能会使输入采用父级宽度。 https://codesandbox.io/s/optimistic-benz-ilnz2