我正在尝试创建HTML电子邮件,因此使用了大量嵌套表。但是,我的第二行<tr>
与第一行不一致,我不太清楚为什么。以下是它现在的表现:
我希望第二行居中而不是触及边缘。
这就是我所拥有的:
<!-- BACKGROUND -->
<table cellpadding="0" cellspacing="0" border="0" width="100%" bgcolor="#000000">
<tbody>
<tr>
<td>
<!-- SECTION 1 -->
<!--START OF EMAIL BODY -->
<table cellpadding="0" cellspacing="0" border="0" width="600" align="center">
<tbody>
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="600" bgcolor="#ffffff">
<tbody>
<tr>
<td height="30"><!-- PADDING --></td>
<tr>
<td style="font-family:Arial;font-size:12px;line-height:15px;color:#353535;text-align:center;">
Not rendering correctly? View this email as a web page <a href="#" target="_blank" style="color:#54537e;">here</a>.
</td>
</tr>
<tr>
<td height="15"><!-- PADDING --></td>
</tr>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!--END OF EMAIL BODY -->
<!-- SECTION 1 END -->
</td>
</tr>
<tr>
<td>
<!-- SECTION 2 -->
<!-- LOGO AND SOCIAL MEDIA -->
<table cellpadding="0" cellspacing="0" border="0" width="600" bgcolor="#FFFFFF">
<tbody>
<tr>
<td><!-- <td height="60">-->
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td width="425"><!-- PADDING --></td>
<td style="font-family:Arial;font-size:10px;line-height:15px;color:#353535;text-align:center;font-weight:bold;">SHARE
</td>
<td width="10"><!-- PADDING (SPACE BETWEEN SHARE AND LINKS) --></td>
<!-- LINKEDIN-->
<td>
</td>
<!-- TWITTER -->
<td>
</td>
<!-- YOUTUBE -->
<td>
</td>
</tr>
</tbody>
</table>
<!-- SECTION 2 END -->
</td>
</tr>
</tbody>
</table>
答案 0 :(得分:1)
行的对齐没有问题。
未对齐的是两个表在行内。
比较
<!--START OF EMAIL BODY --> <table cellpadding="0" cellspacing="0" border="0" width="600" align="center"> <!-- LOGO AND SOCIAL MEDIA --> <table cellpadding="0" cellspacing="0" border="0" width="600" bgcolor="#FFFFFF">
其中一个集中。另一个是左对齐的。