在實際電子郵件中刪除了Gmail電子郵件表格填充

我在gmail的表格中存在填充問題。非常感激任何的幫助。請記住，這是一個gmail電子郵件，所以所有的css都不得不內聯。謝謝！在實際電子郵件中刪除了Gmail電子郵件表格填充

它看起來像這樣適當填充編寫的消息中：

隨後便出現去除填充在上表中實際的電子郵件：

這是一塊

<td background="http://timshoemake.io/wp-content/uploads/email-template/prowler3.png" style="line-height:10px; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; border:0;padding-top:40px !important;padding-right:30px !important;padding-bottom:20px !important;padding-left:30px !important; background-image:url('http://timshoemake.io/wp-content/uploads/email-template/prowler3.png'); background-size: cover; -webkit-background-size: cover; -moz-background-size: cover -o-background-size: cover; background-position: center; background-repeat: no-repeat;">

代碼：

與在TD元件的填充代碼210

<table style="max-width: 600px;" align="center" cellpadding="0" cellspacing="0" border="0" > 
      <tr> 
       <td background="http://timshoemake.io/wp-content/uploads/email-template/prowler3.png" style="line-height:10px; border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; border:0;padding-top:40px !important;padding-right:30px !important;padding-bottom:20px !important;padding-left:30px !important; background-image:url('http://timshoemake.io/wp-content/uploads/email-template/prowler3.png'); background-size: cover; -webkit-background-size: cover; -moz-background-size: cover -o-background-size: cover; background-position: center; background-repeat: no-repeat;"> 

       <table width="70" align="left" border="0" cellpadding="0" cellspacing="0" > 
        <tr> 
         <td height="70" style="padding: 0 20px 20px 0;"> 
          <img src="http://timshoemake.io/wp-content/uploads/email-template/[email protected]" style="height: auto; "width="70" height="70" border="0" alt=""/> 
         </td> 
         <td> 
          <!--[if (gte mso 9)|(IE)]> 
          <table width="425" align="left" cellpadding="0" cellspacing="0" border="0"> 
           <tr> 
            <td> 
            <![endif]--> 
             <table align="left" border="0" cellpadding="0" cellspacing="0" style="width: 425px!important; width: 100%; max-width: 425px;"> 
              <tr> 
               <td height="70"> 
               <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
                <tr> 
                 <td style="font-size: 15px; color: #ffffff; font-family: sans-serif; letter-spacing: 10px; padding: 0 0 0 3px;"> 
                  CREATING 
                 </td> 
                </tr> 
                <tr> 
                 <td style="font-size: 33px; line-height: 38px; font-weight: bold; color: #ffffff; padding: 5px 0 0 0;"> 
                  Beautiful Fitness Web Design 
                 </td> 
                </tr> 
               </table> 
               </td> 
              </tr> 
             </table> 
            <!--[if (gte mso 9)|(IE)]> 
            </td> 
           </tr> 
          </table> 
          <![endif]--> 
         </td> 
        </tr> 
       </table> 
       </td> 
      </tr> 
       </table>

來源

2017-07-12 tshoemake

我只能說，多麼噩夢。我不得不創建TD塊空間，並完全取出填充。這是完成的代碼，我不幸沒有時間進行編輯，因此您可以使用工具進行比較。

成品，經過約2個小時的工作：

<table style="width: 600px;" align="center" cellpadding="0" cellspacing="0" border="0" > 
       <tr> 
        <td background="http://timshoemake.io/wp-content/uploads/email-template/prowler3.png" style="line-height:10px; background-image:url('http://timshoemake.io/wp-content/uploads/email-template/prowler3.png'); background-size: cover; -webkit-background-size: cover; -moz-background-size: cover -o-background-size: cover; background-position: center; background-repeat: no-repeat;" > 

        <table width="70" align="left" border="0" cellpadding="0" cellspacing="0" > 
         <tr> 
          <td width="40px"> &nbsp;&nbsp;&nbsp;&nbsp; </td> 
          <td height="70" style="padding: 0 20px 20px 0;"> 
           <img src="http://timshoemake.io/wp-content/uploads/email-template/[email protected]" style="height: auto; "width="70" height="70" border="0" alt=""/> 
          </td> 
          <td> 
           <!--[if (gte mso 9)|(IE)]> 
           <table width="425" align="left" cellpadding="0" cellspacing="0" border="0"> 
            <tr> 
             <td> 
             <![endif]--> 
              <table align="left" border="0" cellpadding="0" cellspacing="0" style="width: 425px; width: 100%; max-width: 425px;"> 

               <!-- top padding --> 
               <tr> 
                <td width="600px" height="40px"></td> 
               </tr> 

               <!-- header content --> 
               <tr> 
                <td height="70"> 
                <table width="425px" border="0" cellspacing="0" cellpadding="0" style="font-family: 'Raleway', Helvetica, Arial, sans-serif;" > 
                 <tr> 

                  <td style="font-size: 15px; color: #ffffff; font-family: sans-serif; letter-spacing: 10px; padding: 0 0 0 3px;"> 
                   Creating 
                  </td> 
                 </tr> 
                 <tr> 
                  <td style="font-size: 30px; line-height: 38px; font-weight: bold; color: #ffffff; padding: 5px 0 0 0;"> 
                   Beautiful Fitness Web Design 
                  </td> 
                  <!-- <td width="20px"></td> --> 
                 </tr> 
                </table> 
                </td> 
               </tr> 

               <!-- bottom padding --> 
               <tr> 
                <td width="600px" height="40px"></td> 

               </tr> 
              </table> 
          </td> 
             <!--[if (gte mso 9)|(IE)]> 
             </td> 
            </tr> 
           </table> 
           <![endif]--> 
         </tr> 
        </table> 
        </td> 
       </tr> 
</table>

來源

2017-07-13 02:24:12 tshoemake

在實際電子郵件中刪除了Gmail電子郵件表格填充

回答

相關問題