Firefox发行表标题为100％宽度，而不是父元素

Question

我在firefox中有一个问题，其中桌子标题不尊重其父母的宽度

例如，我有

.table {
    width:50%;
    border: none;
    border-spacing:0;
    border-collapse: collapse;
 }
.table caption {
    Width:100%;
}
<table class="table" Style="float:left;">
<caption>Caption</caption>
</table>

但是，标题将扩展到页面宽度的100％，而不是父母。如果我将其设置为50％的宽度，它似乎尊重父宽度。我在IE，Edge或Chrome上没有问题

Answer 1

首先 - 制作一个更完整的表来反映真实代码

第二 - 不要将宽度设置为标题，因为不需要它

https://jsfiddle.net/uqfuvo5s/

.table {
      width: 50%;
      border: none;
      border-spacing: 0;
      border-collapse: collapse;
    }

<table class="table" Style="float:left;">
      <caption>Caption</caption>
      <tbody>
        <tr>
          <td>test</td>
        </tr>
      </tbody>
    </table>