0

我有一个表格，我已将按钮插入到其单元格中。但是，尽我所能，我无法摆脱单元格顶部和按钮之间出现的一些空白。

这是 Jsfiddle 中的一个示例：http: //jsfiddle.net/7Bz36/1/

我有一个带按钮的简单表格

<table border="1">
    <tr>
        <td>
             <button id="1"></button>
        </td>
    </tr>
</table>

使用一些 CSS 并尝试摆脱它：

button {
    height: 15px;
    width: 15px;
    border-radius: 0px;
    margin: 0px;
    white-space: none;
}
table {
    border-collapse: collapse;
}
tr td {
    height: 15px;
    padding: 0px;

谁能弄清楚如何摆脱它？谢谢！

4

3 回答 3

1

您没有为按钮使用任何文本值，使用font-size: 0;或line-height: 0;

演示（字体大小 0）

演示 2（行高 0）

同样id="1"无效，id 名称不能以 int 开头

于 2013-05-05T05:24:38.780 回答
1

尝试这个：

button {
    height: 15px;
    width: 15px;
    border-radius: 0px;
    display: block;
}

table, td, button {
    margin: 0px;
    padding: 0px;    
}

这将设置所有涉及的元素margins并将元素设置为以摆脱一些内联元素空白。paddings0px;buttondisplay: block;

jsFiddle

于 2013-05-05T05:29:32.273 回答
0

通过您的 jsfiddle 尚不清楚问题出在哪里。

此外，none这不是white-space您的 CSS 中的有效属性。你知道你在做什么，或者你只是添加随机样式希望它会起作用？

无论如何，您的代码格式不正确，CSS 以 结尾</table>，什么？此外，您的 html 在这里构造不正确，在 jsfiddle 中也没有。

您似乎根本没有对这个问题进行太多研究，而是尝试了随机性和 SO。

我很乐意帮助你，但我看不出问题所在。这里没有很好地解释，也没有在 jsfiddle 中显示。

于 2013-05-05T05:25:04.777 回答