HTML 无法删除填充答案

【问题标题】：HTML Can not remove paddingHTML 无法删除填充
【发布时间】：2021-06-19 10:11:31
【问题描述】：

我通常从不使用 HTML 和 CSS，所以我正在手动构建一个非常简单的 HTML 页面。我想在表格单元格中使用表格，并删除两者之间的所有填充。我正在使用这个非常简单的结构：

<style>
.takeoutmargins{
    margin: 0%;
}
</style>
<div>Site
    <table>
        <tbody>
            <tr>
                <td>&nbsp;</td>
            <td>
                <table>
                    <tbody>
                        <tr>
                            <td>1</td>
                        </tr>
                        <tr>
                            <td>2</td>
                        </tr>
                        <tr>
                            <td>3</td>
                        </tr>
                    </tbody>
                </table>
            </td>
            <td>
                <table class="takeoutmargins">
                    <tbody>
                        <tr>
                            <td>href1</td>
                            <td>href2</td>
                        </tr>
                    </tbody>
                </table>
            </td>
            </tr>
        </tbody>
    </table>
    <div>&nbsp;</div>
</div>

但填充始终存在。 JSFiddle JSFIDDLE

谢谢

【问题讨论】：

这能回答你的问题吗？ Remove all padding and margin table HTML and CSS
不确定您要达到什么目的，但表格单元格中的表格已经不好用了。您应该改用 colspan/rowspan。除此之外，您似乎尝试使用表格进行样式设置，这将是另一个错误。

标签： html css html-table padding

【解决方案1】：

.takeoutmargins td { padding: 0; }

【讨论】：

【解决方案2】：

.takeoutmargins{
    margin: 0;
}

table td{
  padding:0;
}

<!DOCTYPE html>
<html>
<head>
<style>
.takeoutmargins{
    padding:0;
}
</style>
</head>
<body>
<div>Site
<table>
<tbody>
<tr>
<td>&nbsp;</td>
<td>
<table>
<tbody>
<tr>
<td>1</td>
</tr>
<tr>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
</tbody>
</table>
</td>
<td>
<table class="takeoutmargins">
<tbody>
<tr>
<td>href1</td>
<td>href2</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<div>div</div>
</div>
</body>
</html>

【讨论】：