内部列填充 mailchimp
Interior column padding mailchimp
我正在制作自定义 html 模板，但不知道如何在列（带有 'call to action' 按钮的列）上制作内部填充
我一直在尝试在内容之前插入一个带有宽度的小 td，但它打破了列。
下面是我的代码（抱歉体积太大），但我无法确定在不破坏它的情况下将其削减的确切位置。
<table width="650" style="background-color: #077ec3" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper" mc:repeatable mc:variant="2 Column With IMAGE + TITLE + DESC + READ MORE" style="table-layout:fixed;">
<tr>
<td height="15" class="fix_height"> </td>
</tr>
<tr>
<td class="pad_side" >
<table width="310" border="0" cellspacing="0" cellpadding="0" align="left" class="wrapper">
<tr>
<td align="center" valign="top">
<table width="310" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper">
<tr>
<td width="45" class="hide"> </td>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" valign="top"><img src="https://gallery.mailchimp.com/330985abb260e1ae49eb607dd/images/a3bb236f-8b0a-4003-93de-6f40d964612c.jpg" width="265" height="130" alt="img_265X130" style="display:block;border:none; max-width:265px;" mc:edit="product1_img">
</td>
</tr>
<tr>
<td height="25" class="fix_height" style="background-color: #ffffff;"> </td>
</tr>
<tr style="background-color: #ffffff">
<td class="black" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:18px;line-height:24px;color:#333333;" mc:edit="product1_title">Blog Post</td>
</tr>
<tr>
<td height="8" style="line-height:1px;font-size:1px; background-color: #ffffff;"> </td>
</tr>
<tr>
<td class="grey" align="left" valign="top" style="font-family:Arial, sans-serif;background-color: #ffffff;font-size:13px;line-height:20px;color:#333333;" mc:edit="product1_description">Text block 1</td>
</tr>
<tr>
<td height="15" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
<tr mc:hideable>
<td height="43" style="background-color: #ffffff" valign="top">
<table border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="43" class="button_2" align="center" style="background-color:#ffffff; font-family:Arial, sans-serif;font-size:16px;line-height:18px;color:#ffffff;border-radius:3px;" bgcolor="#ffffff" mc:edit="btn_10">
<a href="#" target="_blank" style="text-decoration:none;color:#ffffff;font-weight:600" class="button_2"> Call to action </a>
</td>
</tr>
<tr>
<td height="25" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="40" style="line-height:1px;font-size:1px;" class="hide"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="310" border="0" cellspacing="0" cellpadding="0" align="right" class="wrapper">
<tr>
<td align="center" valign="top">
<table width="310" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" valign="top" class="pad_top"><img src="https://gallery.mailchimp.com/330985abb260e1ae49eb607dd/images/a3bb236f-8b0a-4003-93de-6f40d964612c.jpg" width="265" height="130" alt="img_265X130" style="display:block;border:none; max-width:265px;" mc:edit="product2_img">
</td>
</tr>
<tr>
<td height="25" class="fix_height" style="background-color: #ffffff;"> </td>
</tr>
<tr>
<td class="black" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:18px;line-height:24px;color:#333333;background-color: white;" mc:edit="product2_title">Blog Post 2</td>
</tr>
<tr style="background-color: white;">
<td height="8" style="line-height:1px;font-size:1px;" > </td>
</tr>
<tr>
<td class="grey" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:13px;line-height:20px;color:#333333;background-color:#ffffff;" mc:edit="product2_description">Text block 2</td>
</tr>
<tr style="background-color: white;">
<td height="15" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr mc:hideable>
<td height="43" style="background-color: #ffffff" valign="top">
<table border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="43" class="button_2" align="center" style="background-color:#ffffff; font-family:Arial, sans-serif;font-size:16px;line-height:18px;color:#ffffff;border-radius:3px;" bgcolor="#ffffff" mc:edit="btn_10">
<a href="#" target="_blank" style="text-decoration:none;color:#ffffff;font-weight:600" class="button_2"> Call to action </a>
</td>
</tr>
<tr>
<td height="25" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="45" class="hide"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
将 padding-left 添加到包含您想要 space 的文本和号召性用语的 td 元素。
填充得到很好的支持，因此可以正常工作。
我正在制作自定义 html 模板，但不知道如何在列（带有 'call to action' 按钮的列）上制作内部填充
我一直在尝试在内容之前插入一个带有宽度的小 td，但它打破了列。
下面是我的代码（抱歉体积太大），但我无法确定在不破坏它的情况下将其削减的确切位置。
<table width="650" style="background-color: #077ec3" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper" mc:repeatable mc:variant="2 Column With IMAGE + TITLE + DESC + READ MORE" style="table-layout:fixed;">
<tr>
<td height="15" class="fix_height"> </td>
</tr>
<tr>
<td class="pad_side" >
<table width="310" border="0" cellspacing="0" cellpadding="0" align="left" class="wrapper">
<tr>
<td align="center" valign="top">
<table width="310" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper">
<tr>
<td width="45" class="hide"> </td>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" valign="top"><img src="https://gallery.mailchimp.com/330985abb260e1ae49eb607dd/images/a3bb236f-8b0a-4003-93de-6f40d964612c.jpg" width="265" height="130" alt="img_265X130" style="display:block;border:none; max-width:265px;" mc:edit="product1_img">
</td>
</tr>
<tr>
<td height="25" class="fix_height" style="background-color: #ffffff;"> </td>
</tr>
<tr style="background-color: #ffffff">
<td class="black" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:18px;line-height:24px;color:#333333;" mc:edit="product1_title">Blog Post</td>
</tr>
<tr>
<td height="8" style="line-height:1px;font-size:1px; background-color: #ffffff;"> </td>
</tr>
<tr>
<td class="grey" align="left" valign="top" style="font-family:Arial, sans-serif;background-color: #ffffff;font-size:13px;line-height:20px;color:#333333;" mc:edit="product1_description">Text block 1</td>
</tr>
<tr>
<td height="15" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
<tr mc:hideable>
<td height="43" style="background-color: #ffffff" valign="top">
<table border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="43" class="button_2" align="center" style="background-color:#ffffff; font-family:Arial, sans-serif;font-size:16px;line-height:18px;color:#ffffff;border-radius:3px;" bgcolor="#ffffff" mc:edit="btn_10">
<a href="#" target="_blank" style="text-decoration:none;color:#ffffff;font-weight:600" class="button_2"> Call to action </a>
</td>
</tr>
<tr>
<td height="25" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="40" style="line-height:1px;font-size:1px;" class="hide"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="310" border="0" cellspacing="0" cellpadding="0" align="right" class="wrapper">
<tr>
<td align="center" valign="top">
<table width="310" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" valign="top" class="pad_top"><img src="https://gallery.mailchimp.com/330985abb260e1ae49eb607dd/images/a3bb236f-8b0a-4003-93de-6f40d964612c.jpg" width="265" height="130" alt="img_265X130" style="display:block;border:none; max-width:265px;" mc:edit="product2_img">
</td>
</tr>
<tr>
<td height="25" class="fix_height" style="background-color: #ffffff;"> </td>
</tr>
<tr>
<td class="black" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:18px;line-height:24px;color:#333333;background-color: white;" mc:edit="product2_title">Blog Post 2</td>
</tr>
<tr style="background-color: white;">
<td height="8" style="line-height:1px;font-size:1px;" > </td>
</tr>
<tr>
<td class="grey" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:13px;line-height:20px;color:#333333;background-color:#ffffff;" mc:edit="product2_description">Text block 2</td>
</tr>
<tr style="background-color: white;">
<td height="15" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr mc:hideable>
<td height="43" style="background-color: #ffffff" valign="top">
<table border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="43" class="button_2" align="center" style="background-color:#ffffff; font-family:Arial, sans-serif;font-size:16px;line-height:18px;color:#ffffff;border-radius:3px;" bgcolor="#ffffff" mc:edit="btn_10">
<a href="#" target="_blank" style="text-decoration:none;color:#ffffff;font-weight:600" class="button_2"> Call to action </a>
</td>
</tr>
<tr>
<td height="25" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="45" class="hide"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
将 padding-left 添加到包含您想要 space 的文本和号召性用语的 td 元素。
填充得到很好的支持，因此可以正常工作。