Firefoxが複数のrowspanとcolspanで表を正しく表示しない

Question

次のコードは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>

Answer 1

次の例から削除することはできません、私は最後の空を取り出して、それは固定の問題のように見えます。 なぜ最後のtr固定問題を削除するだけではないのか分かりません。 しかし、私はそれが働いています、ありがとうございました。