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を介して問題が何であるかは明らかではありません。

また、CSSnoneの有効なプロパティではありません。white-space何をしているのか知っていますか、それとも機能することを期待してランダムなスタイリングを追加しているだけですか?

とにかく、あなたのコードは適切にフォーマットされていません。CSS は で終わって</table>います。また、あなたのhtmlはここでもjsfiddleでも正しく構築されていません。

この質問についてはあまり調査していないようですが、ランダム性とSOを試してみました。

お役に立てれば幸いですが、問題がわかりません。ここでは十分に説明されておらず、jsfiddle にも表示されていません。

于 2013-05-05T05:25:04.777 に答える