2016-08-25 11 views
1

私はHTML emailerを作っています。 Gmailでテンプレートを見ると、画像の周りに余分なパディングが置かれます。Gmailの余分な埋め込み

私が使用している:

border-spacing:0; 
display:block; 
をしかし、それは働いていません。

HTML

<table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; margin: 0 auto; border-spacing:0px; margin-left: 15px;" align="left" border="0" cellpadding="0" cellspacing="0"> 
    <tbody> 
     <tr> 
      <td align="center"> 
       <table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="110"> 
        <tbody> 
         <tr> 
          <td align="center" height="100" valign="top" width="110"> 
           <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"> 
            <a class="modimg" style="text-decoration: none!important;" href="#"> 
             <img style="display: block; border: 3px solid #ffcbbc; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" border="0" height="110" width="110"> 
            </a> 
           </p> 
          </td> 
         </tr> 
        </tbody> 
       </table> 
      </td> 
     </tr> 
     <tr> 
      <td class="h2" style="font-weight: bold;font-family: 'Montserrat', sans-serif; padding-top: 2px; padding-bottom: 0px;color:#ffffff;"> 
       <p style="padding: 0; margin: 0 auto; max-width: 110px; text-align: center;font-size: 10px;"> 
        <span class="wrap_textbox">Mr. R. Chandrasekhar</span> 
       </p> 
       <p style="padding:0; margin:0 auto; max-width:110px;text-align: center !important; font-size: 8px;"> 
        <span class="wrap_textbox">President at NASSCOM</span> 
       </p> 
      </td> 
     </tr> 
    </tbody> 
</table> 

ありがとうございました。

+0

これまでの視覚的な例やコードを教えてください。 – Roberrrt

+0

良いアイデアroberrrt –

+0

コード、そうでない場合は、問題の原因が何であるかを推測します: – Pete

答えて

0

padding:0margin:0を使用しています。あなたがそれらを置くことを望むあなたの必要に応じて。

0

私は上記の問題を再現できませんでしたが、問題を解決する可能性のある欠落がいくつか見受けられました。

これを試してください(上記の例の6行目から始まります)。

<table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="110"> 
    <tbody> 
     <tr> 
      <td align="center" height="100" valign="top" width="110"> 
       <a class="modimg" style="text-decoration: none!important;" href="#"> 
        <img style="display: block; border: 3px solid #ffcbbc; outline: none; text-decoration: none;-ms-interpolation-mode: bicubic; display: block; mso-height-rule: exactly; line-height: 1;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" border="0" height="110" width="110"> 
       </a> 
      </td> 
     </tr> 
    </tbody> 
</table> 
+0

私がしたいことは..です。画像の周りに余分な余白を残します。 –

関連する問題