HTML/CSS：垂直边框与水平边框重叠

这是小提琴：

HTML

丑,对。那么为什么红色边框会覆盖/覆盖绿色边框呢

---

我怎样才能得到“未触及”的水平绿色波德尔？（请不要使用HTML5/CSS3，可访问性目的）

如果由于折叠表格边框而导致该行为，请使用

边框间距：0

相反，在第一个数据行调用一个类，然后我使用下面的选择器关闭了

边框顶部

.second-row td {
    border-top: 0;
}

（在chrome和firefox上测试）

@詹姆斯唐纳利：谢谢你：）这是一种真正的体育精神，因为你的答案得到了一些好的投票，但不幸的是，这不是跨浏览器。。。

/* ACTUAL CSS */
table {
    width: 300px;
    border-collapse: collapse;
}
tr td.first-column{
    border-left: none;
}
tr.first-line {
    border-bottom: 3px solid green;
    border-top: none;
}
tr.first-line td {
    border-left: none;
}
td {
    border-left: 3px solid red;
}
tr {
    border-top: 3px solid red;
}

.second-row td {
    border-top: 0;
}

/* ACTUAL CSS */
table {
    width: 300px;
    border-spacing: 0;
}

tr td.first-column{
    border-left: none;
}

td {
    border-left: 3px solid red;
    border-top: 3px solid red;
}

tr.first-line td {
    border-left: none;
    border-bottom: 3px solid green;
    border-top: none;
}

.second-row td {
    border-top: 0;
}