Question

我正在尝试为表格单元格提供左边框。它在Chrome中运行良好，但在Firefox和IE中没有显示边框。

我在文档中看到左右边框没有得到广泛支持，但可能有一种解决方法，或者我在代码中做错了。

奇怪的是，我的桌子上有圆角边框，左边框和左边框都有，并且每个浏览器都显示正常。

以下是相关代码：

<tr class="Panel_Middle_Row">
    <td class="Panel_Middle_Left_Cell" width="20"></td>
    <td class="Panel_Middle_Middle_Cell">blablabla</td>
    <td class="Panel_Middle_Right_Cell"></td>
</tr>

相应的css：

.Panel_Middle_Left_Cell {
  width: 20px;
  border-left-style:solid;
  border-left-color:#CCC;
  border-left-width:2px;
}
.Panel_Middle_Right_Cell {
  width: 20px;
  border-right-style:solid;
  border-right-color:#CCC;
  border-right-width:2px;*/
}

您可以找到示例here。

Answer 1

您的td为空，因此无法显示。添加 。

或者将其添加到您的表类：empty-cells: show;

Answer 2

试试这个：

<!DOCTYPE html>
<html>
<head>
<style>    
td.Panel_Middle_Left_Cell {
  width: 20px;
  border-left-style:solid;
  border-left-color:#CCC;
  border-left-width:2px;
}

td.Panel_Middle_Right_Cell {
  width: 20px;
  border-right-style:solid;
  border-right-color:#CCC;
  border-right-width:2px;
}
</style>
</head>

<body>
<table>
<tr class="Panel_Middle_Row">
    <td class="Panel_Middle_Left_Cell">jcjgcjgc</td>
    <td class="Panel_Middle_Middle_Cell">blablabla</td>
    <td class="Panel_Middle_Right_Cell"></td>
</tr>
</table>
</body>
</html>

在Firefox和IE中没有通过表格单元格的边框

2 个答案: