テーブル要素間のスペースを作成する

Question

HTMLメールのテキストと画像の間にギャップを作成しようとしています。しかし、私は何を試してもイメージを動かすことができません。

フィドル：

https://jsfiddle.net/rwcgs0g8/が、私は単純に5pxので下に移動し、画像「あなたを無料でダウンロード」赤をしたいです。

画像の前に（そしてipsumテキストの後に）追加<td height="10"><!-- PADDING --></td>を追加しようとしましたが、何もしません。 style="display:block;margin-top:5px;"

それとも へ

Answer 1

その画像の変更スタイル、テキストと画像の間のdivを置きます。 DivはブロックHTML要素です。

<div style="height:5px">&nbsp;</div> 

Answer 2

画像のCSSに

margin-top: 5px;

を追加するだけです。

Answer 3

<table cellpadding="0" cellspacing="0" border="0" width="600" bgcolor="#0066cb"> 
 
\t <tbody> 
 
\t \t <tr> 
 
\t \t <td height="240" width="15"><!-- PADDING (CREATING AREA) --></td> 
 
\t \t <td> 
 
\t \t <table cellpadding="0" cellspacing="0" border="0"> 
 
\t \t \t <tbody> 
 
\t \t \t \t <tr><td height="10"><!-- PADDING --></td></tr> 
 
\t \t \t \t <tr> 
 
\t \t \t \t  <td> 
 
\t \t \t \t \t \t <!-- IMAGE --> 
 
         <img src="http://i65.tinypic.com/2z3tc0w.png" alt="img1" height="250" style="display:block;" border="0" /> 
 
\t \t \t \t \t </td> 
 
\t \t \t \t \t <td style="font-family:Arial;font-size:27px;line-height:35px;color:#ffffff;"> 
 
        <p style="padding-bottom: 5px;margin: 0;"> 
 
         eguide title lorum ipsum <br/> 
 
\t \t \t \t \t \t dolor sit amet labore etJavaScript 
 
        </p> 
 
\t \t \t \t \t <img src="https://www.imageupload.co.uk/images/2017/08/22/unnamed5.png" alt="img2" style="display:block;" border="0" /> 
 
\t \t \t \t \t </td> 
 
\t \t \t \t </tr> 
 
\t \t \t </tbody> 
 
\t \t </table> \t 
 
\t <!-- END OF SECTION 2 --> \t \t \t \t \t \t \t \t \t \t \t \t 
 
\t </td> \t 
 
\t </tr> 
 
</tbody> 
 
</table>

<p style="padding-bottom: 5px;margin: 0;"> 
    eguide title lorum ipsum <br/> 
    dolor sit amet labore etJavaScript 
</p>