如何设置表格单元格的宽度固定，并使表格可用于完整的可用空间

Question

我有tds的表格，如下所示

正如您所看到的，行中有四列包含ID salesComparisonCell, salesOverTimeCell, conversionsOverTimeCell and prospectsTableContainer。虽然prospectsTableContainer是div，但它是display: table-cell。 现在的问题是，如果由于显示没有显示一列或两列或三列，则每列的展开次数超过其查看但空间为空。如下所示

正如您所看到的，我只是将salesOverTimeCell的显示设置为无。结果salesComparisonCell扩展但有额外的空白。我的意思是内容大小仍然相同，但内容中只显示额外的空白区域。我想要而不是白色空间，或者内容也会扩展，或者如果它不可能，因为它是一个svg，那么单元格应该保持原始大小。

我尝试以像素为单位设置td的宽度，但它不起作用。虽然它的百分比有效，但是当我显示隐藏的td时，它会受到干扰。

这是我在pix

中尝试宽度的尝试

您可以看到绿色矩形中突出显示的div的宽度为251px，即内容宽度。我还尝试将td作为内联属性设置为红色框中的251px，但它不起作用。我还试图改变以绿色突出显示的div的宽度，这可能是这个make内容区域适合可用空间但是它不起作用

百分比看起来像是

您可以看到salesComparisonCell现在看起来不错。虽然其他两个tds现在有问题。但是如果我通过删除display none来添加salesOverTimeCell。事情搞得一团糟。

所以这是我的第一个问题，如何修复图表的tds，或者如果其中一个td被删除，图表会扩展整个区域？

我的第二个问题是显示价值的最后一个td。假设我隐藏了另外两个tds。所以现在它看起来像

你可以看到还有空格。我将thead和tbody属性设置为display: block。现在，如果我还原它然后内容扩展但问题是滚动条消失了所有表格对齐。这是屏幕截图

正如你现在可以看到潜在客户表中没有空白但问题是滚动条消失了。桌面高度也会增加，这会干扰整个页面对齐。

所以我的第二个问题。取消选中display:block后有什么办法吗？滚动条没有消失，桌面显示扩展内容，如上面的屏幕截图所示？

我如何解决我的问题？