2017-02-13 49 views
0

我正在使用Mailchimp模板。我需要9個部分的圖片和文字信息。我創建了9個部分3x3。我使用了模板構建器上的選項,您可以在其中使用圖像和標題。圖片下方的標題。它的風格爲<td>。不過,我要確保高度都一樣,所以看起來是一致的。我似乎無法弄清楚。我已經與填充混淆了,我甚至增加了高度(之前沒有)以及使CSS成爲......所有東西,但是每個部分都在不斷移動,並且它看起來並不一致。有沒有辦法來解決這個問題?Mailchimp:表格列是不同的高度。我怎樣才能讓他們都一樣?

enter image description here

見我的代碼,我(由我首先通過Mailchimp,然後定製生成的)有第一列的部分:

<table border="0" cellpadding="0" cellspacing="0" width="600" id="templateColumns"> 
        <tr> 
        <td align="left" valign="top" class="columnsContainer" width="33%"> 
         <table align="left" border="0" cellpadding="0" cellspacing="0" width="100%" class="templateColumn"> 
         <tr> 
          <td valign="top" class="leftColumnContainer"> 
          <table border="0" cellpadding="0" cellspacing="0" width="100%" class="mcnImageCardBlock"> 
           <tbody class="mcnImageCardBlockOuter"> 
           <tr> 
            <td class="mcnImageCardBlockInner" style="padding-top:9px;padding-right:18px;padding-bottom:2px;padding-left:18px;"> 

            <table align="right" border="0" cellpadding="0" cellspacing="0" class="mcnImageCardBottomContent" width="100%" height="100%" overflow="hidden" style="background-color:#2D6C73;"> 
             <tbody> 
             <tr> 
              <td class="mcnImageCardBottomImageContent" align="left" style="padding-top:0px;padding-right:0px;padding-bottom:0;padding-left:0px;"> 


              <a href="http://teendrive365inschool.com/teens/video-challenge?utm_source=DE&amp;utm_campaign=waystowin&amp;utm_medium=email" title="" target="_blank"> 

               <img alt="Toyota TeenDrive365" src="https://gallery.mailchimp.com/03342d2b00b6ccea697a3e7e5/images/be1f6169-1a44-4c56-ab24-82a3c96d7eec.jpg" width="164" style="max-width:480px;" class="mcnImage"> 
              </a> 

              </td> 
             </tr> 
             <tr> 
              <td class="mcnTextContent" style="padding:8px 15px;color:#FFFFFF;font-family:Helvetica;font-size:11px;font-weight:normal;line-height:110%;text-align:center;" width="146" height="80" overflow="hidden;"> 
              <span style="font-size:11px"> 
               <strong>Toyota TeenDrive365 Video Challenge </strong> 
              </span> 
              <span style="font-size:10px"><br /> 
              Film a safe driving PSA for&nbsp;a&nbsp;chance at $15,000!</span> 
              <br> 
              <span style="font-size:11px"><strong>Challenge Closes February 23</strong></span> 
              <table border="0" cellpadding="0" cellspacing="0" width="100%" class="mcnButtonBlock" style="min-width:100%;"> 
           <tbody class="mcnButtonBlockOuter"> 
           <tr> 
            <td style="padding-top:5px;padding-right:0px;padding-bottom:0px;padding-left:0px;" valign="top" align="center" class="mcnButtonBlockInner"> 
            <table border="0" cellpadding="0" cellspacing="0" width="70%" class="mcnButtonContentContainer" style="border-collapse:separate !important;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom-right-radius:3px;border-bottom-left-radius:3px;background-color:#0C4B74;"> 
             <tbody> 
             <tr> 
              <td align="center" valign="center" class="mcnButtonContent" style="font-family:Arial;font-size:11px;padding:8px;"> 
              <a class="mcnButton" title="Learn More" href="http://teendrive365inschool.com/teens/video-challenge?utm_source=DE&amp;utm_campaign=waystowin&amp;utm_medium=email" target="_blank" style="font-weight:bold;letter-spacing:normal;line-height:100%;text-align:center;text-decoration:none;color:#FFFFFF;">Learn More</a> 
              </td> 
             </tr> 
             </tbody> 
            </table> 
            </td> 
           </tr> 
           </tbody> 
          </table> 
              </td> 
             </tr> 
             </tbody> 
            </table> 
            </td> 
           </tr> 
           </tbody> 
          </table> 

回答

0

原來我需要的所有表結合合併成一個班級並將它們編碼在一起。他們都是獨立的班級。我想到了。謝謝。這可以關閉/刪除。