仅在Chrome中显示错误的表格边框**已确认错误** [英] Erroneous table border displays in Chrome only **Confirmed Bug**

问题描述

我有一个似乎与Chrome无关的问题...通常情况并非如此.但是，我在下面的plunkr中尽可能地重现了这个问题.

有点不高兴提及

这是我们表代码中的一个已知(旧)问题.崩溃的边界是根据相邻单元格确定，我们的代码处理不正确跨单元格(我们仅考虑与第一行相邻的单元格/列/行跨度).最重要的是，我们的边界粒度取决于单元格的跨度.

要解决此错误，我们需要彻底检查崩溃的边界代码，这是一项艰巨的任务.

结论:

如果表格具有边界折叠

，单元格为合并

然后，不同的边界设置(对于该单元格，隐式)将失败

修复它的可能性:

设置边框样式:隐藏在单元格中的优先级更高，并且将隐藏所有边框(不好)

去除垫片中的colspan

或者可以完全移除隔行并在没有隔行的情况下处理显示器.

I have an issue that seems to be isolated to Chrome...which is usually NOT the way it goes. However, I have recreated the issue as purely as possible in the following plunkr.

http://plnkr.co/edit/k0viyc

To illustrate the problem, here is an image that displays the border in the highlighted row in Chrome and how it isn't showing in IE.

If you remove either of the following rows:

<tr class="spacer">
  <td colspan="14" class="noBorder noBackground">
    *** By removing this row, the extended border goes away ***
  </td>
</tr>

You will see the associated border shows/hides.

We've been through lots of tests on this and can't isolate the problem. The primary css remains in the plunkr, including the inline styles and classes that are primarily byproducts of related bindings.

I would like to know if there is an error in the current design or if this is truly a bug in Chrome. If it's a bug, what is the least common elements here needed to recreate it? Is it worth submitting as a bug or is this just going to be a scenario we should just try to avoid.

Thanks for your time in advance.

解决方案

Looks like to be a Chrome bug.

Minimal showcase reproducing it

.test {
  border-collapse: collapse;
}

td {
  border: solid 1px blue;
}

.no {
  border: none;
}

<table class="test">
<tr>
<td>one</td>
<td class="no">two</td>
</tr>
<tr>
<td class="no" colspan="2">double</td>
</tr>
</table>

Chromium tracking (somehow) related border rendering bug

A little disturbing the mention

It's a known (old) issue in our table code. Collapsing borders are determined based on adjacent cells and our code doesn't deal correctly with spanning cells (we only consider the cell adjoining the first row / column in a row / column span). On top of that, our border granularity is determined by the cell's span.

To fix this bug, we would need to overhaul our collapsing border code, which is a big undertaking.

In conclusion:

If the table has border-collapse

and the cell is colspaning

Then different border settings (for that cell, implicitly) will fail

Posibilities to fix it:

Setting border-style: hidden to the cell has higher priority and will hide all the borders (not good)

Removing colspan in the spacers

or maybe remove fully the spacers rows and handle the display without them.

这篇关于仅在Chrome中显示错误的表格边框**已确认错误**的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！