javascript - 防止表从长 td 增长

Question

我有一个包含子表的表。我不希望子表影响表格的宽度——在溢出的情况下，我希望两者独立滚动。此外，由于子表是基于切换显示的，所以我不希望主表行根据子表是否可见而跳转

Here's代码笔。

我想我可以用 table-layout: fixed 来完成这个，但我不一定知道 td 的内容，它可能很长。如果我要使用 table-layout: fixed，td 是否仍然可以根据内容增长收缩？

This是我想做的一个例子，嵌套表独立于它的容器表滚动。

Answer 1

我想通了，我最终做的是将子表包装在另一个具有固定布局的表中，在一个 td 中并打开溢出。不幸的是，它似乎在 firefox 中不起作用。

<td colspan="6">
  <table class="sub-table-container" style="table-layout: fixed; width: 100%">
    <tr><td style="overflow-x: scroll">
       <table class="sub-table">
             ...

参见 this codepen对于更新的解决方案