次の表は、上の<p>タグには margin-bottomを、下の<p>タグにはmargin-topを設定したものです。数字は設定したcm数値。
| bm-0 tp-0 |
bm-0 tp-1 |
bm-0 tp-2 |
bm-0 tp-3 |
bm-1 tp-0 |
bm-1 tp-1 |
bm-1 tp-2 |
bm-1 tp-3 |
bm-2 tp-0 |
bm-2 tp-1 |
bm-2 tp-2 |
bm-2 tp-3 |
(上表から判かること)上下の要素間のmarginは
・margin-bottomとmargin-topの合計ではない。
・margin-bottomとmargin-topの大きいほうの数値が適用
![]()
<table border="1" cellpadding="5" cellspacing="1">
<tr>
<td valign="top">bm-0<p>tp-0</td>
<td valign="top">bm-0<p
style="margin-top:1cm">tp-1</td>
<td valign="top">bm-0<p
style="margin-top:2cm">tp-2</td>
<td valign="top">bm-0<p
style="margin-top:3cm">tp-3</td>
<td valign="top"><p
style="margin-bottom:1cm">bm-1</p>
<p>tp-0</td>
<td valign="top"><p
style="margin-bottom:1cm">bm-1</p>
<p
style="margin-top:1cm">tp-1</td>
<td valign="top"><p
style="margin-bottom:1cm">bm-1</p>
<p
style="margin-top:2cm">tp-2</td>
<td valign="top"><p
style="margin-bottom:1cm">bm-1</p>
<p
style="margin-top:3cm">tp-3</td>
<td valign="top"><p
style="margin-bottom:2cm">bm-2</p>
<p>tp-0</td>
<td valign="top"><p
style="margin-bottom:2cm">bm-2</p>
<p
style="margin-top:1cm">tp-1</td>
<td valign="top"><p
style="margin-bottom:2cm">bm-2</p>
<p
style="margin-top:2cm">tp-2</td>
<td valign="top"><p
style="margin-bottom:2cm">bm-2</p>
<p
style="margin-top:3cm">tp-3</td>
</tr>
</table>
END(99/5/19)