Firefox使用多个rowspan和colspan呈现表格不正确

时间:2016-10-31 16:20:35

标签: html firefox

以下代码在Chrome和IE中运行良好,但在Firefox中无效。

table动态生成,tr / td无法从以下示例中删除



.widget-table-container,
tr td {
  border: 1px solid red;
}
.widget {
  border: 1px solid green;
  margin: 0px;
  padding: 0px;
  background-color: #ffffff;
  border-radius: 5px;
  overflow: hidden;
  height: 100%;
  width: 100%;
  left: 1px;
  top: 1px;
  bottom: 0px;
  right: 0px;
}

<table class="widget-table-container">
  <tbody>
    <tr>
      <td colspan="2" rowspan="2" style="width: 378px; height: 378px;">
        <div class="widget" style="width: 371px; height: 371px; background-color:lightblue;">
          <div class="widget-title">
            <p>Title</p>
          </div>
          <div class="widget-body"></div>
        </div>
      </td>
      <td colspan="8" rowspan="4" style="width: 1512px; height: 756px;">
        <div class="widget" style="width: 1493px; height: 745px;">
          <div class="widget-title">Title CPU</p>
          </div>
          <div class="widget-body">BODY</div>
        </div>
      </td>
    </tr>
    <tr>
    </tr>
    <tr>
      <td colspan="2" rowspan="2" style="width: 378px; height: 378px;">
        <div class="widget" style="width: 371px; height: 371px;">
          <div class="widget-title">
            <p>Some Title</p>
          </div>
          <div class="widget-body"></div>
        </div>
      </td>
    </tr>
    <tr></tr>
  </tbody>
</table>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

我删除了最后一个空,它看起来像修复了问题。 我不确定为什么只删除最后一个固定问题而不是全部tr。 但我的情况是它的工作,谢谢大家的帮助。