views:

1685

answers:

5

I have a very specific html table construct that seems to reveal a Gecko bug.

Here's a distilled version of the problem. Observe the following table in a gecko-based browser (FF, for example): (you'll have to copy and paste this into a new file)

<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>

There's a line missing over the "3" in the bottom-right cell -- view it in any other browser and the line will appear as expected. Interestingly, ditch the thead section of the table and look what we get:

<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>

Doing that makes it work. Has anyone seen this? I suppose I'll just get rid of my thead section for now as a workaround though it makes the table rather less accessible.

+3  A: 

Strange... definitely a painting bug. If you right-click to get the context menu to appear over part of where the line should be, then when you dismiss the context menu, the line has been redrawn underneath.

Edit: Workaround - if you put style="border-color: ...;" on the <td rowspan="3"> you can get the border to appear, but it has to be a different colour - just use one that's as close to the others as possible. For example, if the table is #ff0000 use #ff0001

Greg
Thanks for confirming and good workaround.
Aaron
A: 

I see the same problem.

Seamus
A: 

It's known to me a huge bug with gecko (maybe just ff) that it cannot render some borders. For me rendering in ff is going worse every version starting from 2.0.1x I think. I didnt found a solution for that

A: 

AAAAAAAAAAAAAAAARgh

I hates this bug

There seems to be no way around it

[goes off to play a game] my head is sore from beating against wall

please and thanks for posting this so now i feel not so alone

A: 

i have also found this bug but it's not on my PC but another. If i resize the browser window after a certain resolution the lines will disappear. once i maximise the window the all pop back. you can fix this permanently by setting border-collapse:separate; this gives each boreder of each cell its own width. It's not what i want to do but it works.

It can also be caused by using border-collapse:collapse; then setting aligning borders to 1px and then 0px. Because it collapses the borders it seems to prioritise the 0px over the 1px width.

either way it's firefox only and it's yet another reason to move away from it.

Simon