嵌入式表格与单元格具有相同的高度

Question

我想知道是否有可能让嵌入在td内的表与td具有相同的高度。

<table>
<tr>
    <td style="background:red">
        <table style="background:blue">
            <tr>
                <td>Hello</td>
            </tr>
        </table>
    </td>
</tr>
</table>

这是jsfiddle ...... https://jsfiddle.net/ekh6z8w0/

正如您可以通过小提琴看到的那样，嵌入式表格偏离了一两个像素。是否可以让蓝色内部与轻微的红色边框重叠？

Answer 1

从td中删除填充，应该可以。

td{
padding:0;
}

Answer 2

您可以尝试这样做： Demo

CSS：

table>td, table>td>table {
    padding:0;
    margin:0;

}
table table {
    padding:0;
    margin:0;
    height:100%;
    border:1px solid red;
    background-color:blue;
    color:#fff;
}

HTML：

<table>
    <tr>
        <td>
            <table>
                <tr>
                    <td>Hello</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

希望这就是你想要的。