Responsive design 响应电子邮件：在TD内分发三张表格
我正在学习响应式电子邮件设计，在td中放置三张桌子时遇到了障碍。我可以在td中放置两张桌子，分别将它们左对齐和右对齐，它们的布局很好。但是，当我加入第三个表时，即使在确保三个表的总宽度明显小于容器表的宽度之后，它们也不合理 我尝试设置td align=justify，然后将每个表向左对齐：Responsive design 响应电子邮件：在TD内分发三张表格,responsive-design,html-email,css,text-align,Responsive Design,Html Email,Css,Text Align,我正在学习响应式电子邮件设计，在td中放置三张桌子时遇到了障碍。我可以在td中放置两张桌子，分别将它们左对齐和右对齐，它们的布局很好。但是，当我加入第三个表时，即使在确保三个表的总宽度明显小于容器表的宽度之后，它们也不合理 我尝试设置td align=justify，然后将每个表向左对齐： <tr> <td align="justify" valign="top" class="icons" bgcolor="#ffffff" style="padd
<tr>
<td align="justify" valign="top" class="icons" bgcolor="#ffffff" style="padding: 0px 0px 0px 0px; color: #ffffff; font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size:14px; line-height:24px;">
<table class="gear" width="180" height="185" align="left" border="0" bgcolor="#00adef" cellpadding="0" cellspacing="0">
<tr>
<td class="gear" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
CLASSIC SOHO OFFICE. STATE OF THE ART INFRASTRUCTURE.<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/gear.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
<table class="arrow" width="180" height="185" align="left" border="0" bgcolor="#44c9f6" cellpadding="0" cellspacing="0">
<tr>
<td class="arrow" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
CEILING UP TO 13'6", NATURAL LIGHT, OVERSIZE TERRACES<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/arrow.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
<table class="divide" width="180" height="185" align="left" border="0" bgcolor="#00b9f2" cellpadding="0" cellspacing="0">
<tr>
<td class="divide" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
SPACES FROM<br/>11,000 TO 130,000 RSF<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/divide.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
<br style="clear:both;">
</td>
</tr>
<tr>
<td valign="top" class="icons" bgcolor="#ffffff" style="padding: 0px 0px 0px 0px; color: #ffffff; font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size:14px; line-height:24px;">
<table class="gear" width="180" height="185" align="left" border="0" bgcolor="#00adef" cellpadding="0" cellspacing="0">
<tr>
<td class="gear" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
CLASSIC SOHO OFFICE. STATE OF THE ART INFRASTRUCTURE.<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/gear.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
<table class="arrow" width="180" height="185" align="center" border="0" bgcolor="#44c9f6" cellpadding="0" cellspacing="0">
<tr>
<td class="arrow" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
CEILING UP TO 13'6", NATURAL LIGHT, OVERSIZE TERRACES<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/arrow.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
<table class="divide" width="180" height="185" align="right" border="0" bgcolor="#00b9f2" cellpadding="0" cellspacing="0">
<tr>
<td class="divide" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
SPACES FROM<br/>11,000 TO 130,000 RSF<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/divide.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
<br style="clear:both;">
</td>
</tr>
-MC我想出来了！我添加了一个包含三列的主表，并将每个较小的表放入一列中。我还得回去把它清理干净，但它工作正常。现在看看我能不能让它反应灵敏
<tr>
<td align="justify" valign="top" class="icons" bgcolor="#ffffff" style="padding: 0px 0px 0px 0px; color: #ffffff; font-family: 'Open Sans', Helvetica, Arial, sans-serif; font-size:14px; line-height:24px;">
<table width="100%" border="0">
<tr>
<td>
<table class="gear" align="left" width="185" height="185" border="0" bgcolor="#00adef" cellpadding="0" cellspacing="0">
<tr>
<td class="gear" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
CLASSIC SOHO OFFICE. STATE OF THE ART INFRASTRUCTURE.<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/gear.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
</td>
<td>
<table class="arrow" align="center" width="185" height="185" border="0" bgcolor="#44c9f6" cellpadding="0" cellspacing="0">
<tr>
<td class="arrow" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
CEILING UP TO 13'6", NATURAL LIGHT, OVERSIZE TERRACES<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/arrow.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
</td>
<td>
<table class="divide" align="right" width="185" height="185" border="0" bgcolor="#00b9f2" cellpadding="0" cellspacing="0">
<tr>
<td class="divide" align="center" valign="middle" style="padding: 5px 5px 5px 5px;">
SPACES FROM<br/>11,000 TO 130,000 RSF<br/><br/><img src="http://www.michaelcoleman.net/files/cushman/20140918/images/divide.png" alt="One Soho Square" width="60" height="60" border="0px"></img>
</td>
</tr>
</table>
</td>
</tr>
</table>