使用边框颜色的Chrome表css小故障

Question

我为所选元素定义了一个表格样式：

tr[selected] {
    background: #FFF;
    border-color: #000000;
    color: #000000;
}

我使用javascript：

应用此样式

$this.unbind().change(function () {
        element = $(this).parents('tr');
        if ($(this).is(':selected')) element.attr('selected', '');
        else element.removeAttr('selected')
    });
$this.checkbox();

它的工作原理如何，我使用chrome得到了一个奇怪的故障（例如，没有使用firefox），有时候，在选择和取消选择元素之后，仍然应用了border-color属性的一部分：

预期：

有时：

那是知道的吗？ 这种行为有解决方法吗？

Answer 1

将tr行的样式设置为display: block;，否则表格元素在其他类型的容器中可能无法按预期运行。这对我有用：

tr {
  display: block;
  background: #fff;
  color: #000;
  border: solid 1px #fff;
}
tr[selected] {border: solid 1px #000;}
tr:not([selected]) {border: solid 1px #fff;}