在基於Gecko的瀏覽器中消失CSS表格單元格邊框

Question

我有一個非常具體的html表格結構，它似乎揭示了一個Gecko錯誤。

下面是問題的精簡版。下表觀察在基於Gecko的瀏覽器（FF爲例）：（你要複製並粘貼到一個新文件）

<style> 
table.example{ 
    border-collapse:collapse; 
} 
table.example td { 
    border:1px solid red; 
} 
</style> 
<table class="example"> 
    <thead> 
     <tr> 
      <th>1</th> 
      <th>2</th> 
      <th>3</th>   
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>1</td> 
      <td>2</td> 
      <td rowspan="3">3</td> 

     </tr> 
     <tr> 
      <td>1</td> 
      <td>2</td> 
     </tr> 
     <tr> 
      <td>1</td> 
      <td rowspan="2">2</td>  
     </tr> 
     <tr> 
      <td>1</td> 
      <td>3</td> 
     </tr> 
    </tbody> 
</table> 

有在的失蹤在「3」的行右下角的單元格 - 在任何其他瀏覽器中查看它，並且該行將按預期顯示。有趣的是，溝表thead部分表，看看我們得到：

<style> 
table.example{ 
    border-collapse:collapse; 
} 
table.example td { 
    border:1px solid red; 
} 
</style> 
<table class="example"> 
    <tbody> 
     <tr> 
      <td>1</td> 
      <td>2</td> 
      <td rowspan="3">3</td> 

     </tr> 
     <tr> 
      <td>1</td> 
      <td>2</td> 
     </tr> 
     <tr> 
      <td>1</td> 
      <td rowspan="2">2</td>  
     </tr> 
     <tr> 
      <td>1</td> 
      <td>3</td> 
     </tr> 
    </tbody> 
</table> 

這樣做使它的工作。有沒有人看過這個？我想我現在只是擺脫我的thead部分作爲一種解決方法，儘管它使得表格不太容易訪問。

Answer 1

奇怪的...絕對是一個繪畫錯誤。如果右鍵單擊以使上下文菜單顯示在部分上，那麼當您關閉上下文菜單時，該行將在下面重新繪製。

編輯：解決方法 - 如果你把style="border-color: ...;"的<td rowspan="3">你可以出現在邊界，但它必須是一個不同顏色 - 只使用一個是儘可能靠近別人越好。例如，如果表是＃ff0000，使用＃ff0001

Answer 2

我也發現了這個錯誤，但它不是在我的電腦上，而是另一個。如果我在確定分辨率後調整瀏覽器窗口大小，這些行將消失。一旦我最大化窗口彈出所有回彈。 你可以通過設置border-collapse來永久解決這個問題：separate;這使每個單元的每個鏜孔具有其自己的寬度。這不是我想要做的，但它的工作原理。

它也可能是由使用border-collapse引起的：collapse;然後將邊框設置爲1px，然後設置爲0px。因爲它摺疊邊框，所以似乎優先於1px寬度的0px。

無論哪種方式它只是Firefox，它是另一個離開它的理由。