在 Firefox 上，表格列未按预期扩展

Question

您好，我需要一个与其他 div 在同一行中的流体表。 Here 你可以看到一个我可以做我想做的事情的小提琴，它在 Chrome 上完美运行。问题是当我在 Firefox 上尝试时。列宽是最小的，不像 Chrome 那样扩展。

<div class="container" style="background-color: lightgray; overflow: auto;">
  <div style="height: 200px; overflow-y: auto; margin-right: 300px; float: left;">
    <table border="1" style="">
      <theader>
        <tr>
          <th>ID</th>
          <th style="width:100%">Name</th>
          <th>Time</th>
        </tr>
      </theader>
      <tbody>
        <tr>
          <td>1</td>
          <td style="word-break: break-all">Dan</td>
          <td>00:00:00.000</td>
        </tr>
        <tr>
          <td>2</td>
          <td style="word-break: break-all">Bob</td>
          <td>00:00:00.000</td>
        </tr>
        <tr>
          <td>3</td>
          <td style="word-break: break-all">Jenn</td>
          <td>00:00:00.000</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div style="background-color: #65de4f80; width: 300px; height: 200px; margin-left: -300px; float: left;"></div>
</div>

Answer 1

删除浮动：左侧和溢出：自动在您不需要的顶部

<div class="container" style="background-color: lightgray;">
  <div style="height: 200px; overflow-y: auto; margin-right: 300px;">
    <table border="1" style="">
      <theader>
        <tr>
          <th>ID</th>
          <th style="width:100%">Name</th>
          <th>Time</th>
        </tr>
      </theader>
      <tbody>
        <tr>
          <td>1</td>
          <td style="word-break: break-all">Dan</td>
          <td>00:00:00.000</td>
        </tr>
        <tr>
          <td>2</td>
          <td style="word-break: break-all">Bob</td>
          <td>00:00:00.000</td>
        </tr>
        <tr>
          <td>3</td>
          <td style="word-break: break-all">Jenn</td>
          <td>00:00:00.000</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div style="background-color: #65de4f80; width: 300px; height: 200px; margin-left: -300px; float: left;"></div>
</div>

问候