使用表格行上的边框半径圆角，两个单元格在单元格边界处中断答案

【问题标题】：Rounding corners using border radius on table row with two cells breaks at cell border使用表格行上的边框半径圆角，两个单元格在单元格边界处中断
【发布时间】：2012-02-18 03:56:33
【问题描述】：

我有一个包含两个单元格的表格行，并且该行具有悬停背景颜色我试图使用这样的边框半径来圆滑悬停背景颜色的角：

table tbody tr#ClickableRow:hover td
    {
        background-color: #fbf6e7;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        -khtml-border-radius: 4px;
        border-radius: 4px;
        cursor:pointer; 
    }

<tr id="ClickableRow">
    <td>
<a href="http://somesite.com">Go Here</a>
<p> To find about all the interestng animals found in this tourist attractions including 
zebra, giraffe etc
</p>
    </td>

<td>Call us:444-444-2322</td>
</tr>

它在单元格边界处断裂。如何解决？我无法选择行本身并应用半径..

【问题讨论】：

我遇到了这个问题。原因是表格中的边框或其他元素穿过单元格上的圆形边框。

标签： css html-table row border

【解决方案1】：

在TD 中放一个DIV，在DIV 中添加你的内容。将边框应用于 DIV 而不是 TD。

【讨论】：