html - css 第 n 个 child : borders not displaying properly in chrome only

Question

我有一个 Volusion 电子商务网站，它锁定了我的类别页面的内部 HTML。仅使用提供的类，我试图在类别页面上的表格单元格产品列表中添加顶部和底部边框。出于某种原因，而且仅在 Chrome 中，边框跨越了整个表格行，而这本不应如此。

我正在使用以下 CSS:

table.v65-productDisplay > tbody > tr > td > table.v65-productDisplay > tbody > tr:nth-child(5n+1) > td[width="33%"] {border-top:1px solid #D6D5D5;}
table.v65-productDisplay > tbody > tr > td > table.v65-productDisplay > tbody > tr:nth-child(5n+4) > td[width="33%"] {border-bottom:1px solid #D6D5D5;}

当我检查作为间隔符且不应有边框的表格单元格时，元素的 css 显示它没有边框。我唯一可以得出的结论是，在 chrome 中，表格单元格以某种方式跨越了整行，导致一个 css 边框调用跨越了表格行的整个宽度。

我已经尝试了几乎所有我能想到的方法，但我需要用新的眼光来看待这个问题。您可以在我的网站上查看实际效果: http://www.yandasmusic.com/Portable-Keyboards-s/2119.htm

Answer 1

改变:

table { border-collapse: collapse; }

到:

table { border-collapse: initial; }