Chrome render bug with border-collapse

Question

Chrome renders this markup incorrectly (see jsfiddle for full markup).

table { border-collapse: collapse }

Here it is in Chrome:

Answer 1

According to Chrome bug with colspan and border?, this is a Chrome bug since 2008... which is not fixed yet.

One workaround for this issue is: not use colspan. Sample code is:

<tr>
  <td class=A>1</td>
  <td class=A>2</td>
  <td class=A>3</td>
  <td></td>
  <td></td>
  <td></td>
</tr>

instead of

  <tr>
    <td class=A>1</td>
    <td class=A>2</td>
    <td class=A>3</td>
    <td colspan=3></td>
  </tr>

fiddle for your example.

Or, you can use mistermansam's workaround by abandon border-collapse.