Chrome渲染错误与边框崩溃

Question

Chrome错误地呈现此标记(see jsfiddle for full markup)。

table { border-collapse: collapse }

这是在Chrome中：

和Firefox或Edge中相同的标记：

有没有办法在Chrome中解决此问题？

Answer 1

根据Chrome bug with colspan and border?，这是自2008年以来的Chrome bug ...尚未确定。

此问题的一种解决方法是：不使用colspan。示例代码为：

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

而不是

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

fiddle为您的例子。

或者，您可以放弃border-collapse来使用mistermansam's workaround。