0

我的html是这样的：

<html class="t1">
<tr>
<td></td>
<td><table class="t2 grid"><tr><td></td></tr></table></td>
<td></td>
</tr>
</html>

在我的 CSS 中，我有：

.t1
{
 display: table;
 width: auto; /* 885*/
 border-collapse: collapse;
 border: 1px solid #dddddd;
}
.t1 td
{
 border-collapse: collapse;
 border: 1px solid #dddddd;
}

.t2
{
 display: table;
 width: auto; /* 885*/
 border-collapse: collapse;

}
.t2 td
{
 border-collapse: collapse;

}

.t2 grid
{
            border-top:1px solid #eeeeee !important;
            border-bottom:1px solid #eeeeee !important;
            border-left: none !important;
            border-right: none !important;
}
.t2 grid td
{
            border-top:1px solid #eeeeee !important;
            border-bottom:1px solid #eeeeee !important;
            border-left: none !important;
            border-right: none !important;
}

抱歉，我不能发布我的实际 CSS 或 HTML，但这就是它的想法。

现在由于某种原因，父表网格线显示在内表中每一行的右侧/左侧。

我正在查看 chrome，我可以看到计算的样式，并且父样式仍然有效。

我怎样才能解决这个问题？

问题是，内表现在有一个非常强的外边框，因为样式（我认为）被应用了 2 次。

4

1 回答 1

1

问题在于您如何命名您的 CSS 样式。应该.t2.grid td不是.t2 grid td。

于 2012-07-19T15:57:29.960 回答