web-dev-qa-db-ja.com

テーブル内の単一のTD）のCSSパディング

私はこのように構築されたテーブルを持っています：

<table>
<tr>  <td>1</td>  <td>2</td>  <td rowspan="4">3</td></tr>
<tr>  <td>4</td>  <td>5</td>                        </tr>
<tr>  <td>6</td>  <td>7</td>                        </tr>
<tr>  <td>8</td>  <td>9</td>                        </tr>
<tr height="100"><td colspan="2">10</td><td class="eleven">11</td> </tr>
</table>

これで、問題は最後の行にあります。行全体の高さは100pxに設定されているため、TDには十分なスペースがあります。最後にTD個別のパディングを設定したいので、コンテンツ「11」のみが上からパディングされます。

.eleven {
    padding-top:15px;
}

これを設定すると問題が発生します-この行の最初のTDもパディングされます-top：10px; 2番目の行だけをパディングする理由と方法は？

htmlhtml-tablepadding
6
wiktus239

わかりました、問題の原因を突き止めました。これは、私が使用する小さなhtml5-css-resetスニペットのエントリでした。

vertical-align:baseline;

一般的にほとんどの一般的な要素に割り当てられます。それを念頭に置いて、今ではすべてが想定どおりに機能します。

7
wiktus239

パディングしたいコンテンツを<div>（パディングスタイルを適用する）にラップして、その<div>を<td>に入れてみませんか？

<td>
    <div style="padding-top: 15px;"> 
        Content 
    </div> 
</td>
9
Navneeth G