Question

我需要帮助设置电子邮件简报模板，因为其中一列没有正确显示，包含标题2的列未正确显示它正在向页面右侧显示而不是与模板元素对齐

以下是代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body>
<!--Table Start-->&nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
<table border="0" align="center" cellpadding="0" cellspacing="0" class="cont-bg" bgcolor="#f1f1f1" style="background-color: #f1f1f1; padding: 27px 0px 0px; width: 100%; background-position: initial initial; background-repeat: initial initial;">
    <tbody>
        <tr>
            <td align="center" valign="top" width="1133">&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; <!--Main Part Start-->&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                <table border="0" align="center" cellpadding="0" cellspacing="0" style="width: 650px;">
                    <tbody>
                        <tr>
                            <td align="left" valign="top">&nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; <!--Header Part Start-->&nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;
                                <table border="0" align="center" cellpadding="0" cellspacing="0" style="width: 650px; height: 682px;">
                                    <tbody>
                                        <tr>
                                            <td colspan="2" align="right" valign="top" mc:edit="view" style="font: normal 12px arial, helvetica, sans-serif; color: #000000; padding-bottom: 22px;">You can&rsquo;t see this email?<a href="#"> View it in your browser.</a></td>
                                        </tr>
                                        <tr><!--Logo Start-->
                                            <td width="287" align="left" valign="top" bgcolor="#ffffff" style="background: #fff;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                                <p align="left"><br />
                                                    <img src="commstellogo.png" width="208" height="45" border="0" align="left" /></p></td>
                                            <!--Logo End--><!--Menu Part Start-->
                                            <td width="363" height="94" align="left" valign="middle" bgcolor="#ffffff" style="background: #fff;">&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                                                <table border="0" cellspacing="0" cellpadding="0" style="width: 340px;">
                                                    <tbody>
                                                        <tr>
                                                            <td align="right" valign="top" mc:edit="date" style="font: bold 18px arial, helvetica, sans-serif; color: #2f2f2f; text-transform: uppercase; padding-bottom: 8px;">01727 260 101</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;
                                                                <table border="0" cellspacing="0" cellpadding="0" style="width: 340px;">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td width="16" align="left" valign="top"><img mc:edit="h-icin" src="images/home-icon.png" width="16" height="19" alt="" /></td>
                                                                            <td width="64" align="left" valign="middle" mc:edit="h-text" style="font: bold 12px arial, helvetica, sans-serif; color: #414141; padding-left: 9px;"><a href="#" style="color: #414141;">Home</a></td>
                                                                            <td width="16" align="left" valign="top"><img mc:edit="s-icon" src="images/setting.png" width="16" height="19" alt="" /></td>
                                                                            <td width="79" align="left" valign="middle" mc:edit="s-text" style="font: bold 12px arial, helvetica, sans-serif; color: #414141; padding-left: 9px;"><a href="#" style="color: #414141;">Services</a></td>
                                                                            <td width="16" align="left" valign="top"><img mc:edit="a-icon" src="images/about-us.png" width="16" height="19" alt="" /></td>
                                                                            <td width="77" align="left" valign="middle" mc:edit="a-text" style="font: bold 12px arial, helvetica, sans-serif; color: #414141; padding-left: 9px;"><a href="#" style="color: #414141;">About us</a></td>
                                                                            <td width="18" align="left" valign="top"><img mc:edit="s-icon" src="images/support.png" width="16" height="19" alt="" /></td>
                                                                            <td width="54" align="right" valign="middle" mc:edit="s-text" style="font: bold 12px arial, helvetica, sans-serif; color: #414141; padding-left: 9px;"><a href="#">Contact</a></td>
                                                                        </tr>
                                                                    </tbody>
                                                                </table></td>
                                                        </tr>
                                                    </tbody>
                                                </table></td>
                                            <!--Menu Part End--></tr>
                                        <tr>
                                            <td colspan="2" align="left" valign="top" height="548">&nbsp; &nbsp;&nbsp; &nbsp; &nbsp; <!--Banner Start-->&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
                                                <table border="0" cellspacing="0" cellpadding="0" style="width: 650px;">
                                                    <tbody>
                                                        <tr>
                                                            <td align="left" valign="top"><img mc:edit="banner-image" src="#" width="649" height="356" alt="" style="display: block;" /></td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top" bgcolor="#2f2f2f" style="padding: 25px 0px 18px 20px; background: #2f2f2f;">&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                                                                <table border="0" cellspacing="0" cellpadding="0" style="width: 611px;">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td align="left" valign="top" mc:edit="banner-title" style="font: normal 24px arial, helvetica, sans-serif; color: #fff; padding-bottom: 8px;">Heading Area</td>
                                                                        </tr>
                                                                        <tr>
                                                                            <td align="left" valign="top" mc:edit="banner-text" style="font: normal 12px arial, helvetica, sans-serif; color: #fff; line-height: 18px; padding: 0px 0px 12px 4px;">Vivamus interdum mauris urna. Nullam egestas augue elit. Aliquam pretium elit varius metus hendrerit volutpat. <b>20% off</b> Vivamus interdum mauris urna. Nullam egestas augue elit. Aliquam pretium elit varius metus hendrerit volutpat.</td>
                                                                        </tr>
                                                                        <tr>
                                                                            <td align="left" valign="top"><a href="#"><img mc:edit="banner-read-more" src="#" width="128" height="31" alt="" /></a></td>
                                                                        </tr>
                                                                    </tbody>
                                                                </table></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                &nbsp; <!--Banner End--> &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;</td>
                                        </tr>
                                    </tbody>
                                </table>

                                <!--Header Part End--> &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;</td>
                        </tr>
                        <tr><!--Body Part Start--></tr>
                        <tr>
                            <td width="330" align="left" valign="top">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!--Two column 1 Start-->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <table border="0" cellspacing="0" cellpadding="0" style="width: 320px;">
                                    <tbody>
                                        <tr>
                                            <td align="left" valign="top"><img mc:edit="two-coulmn-image1" src="businesstelephone.png" width="320" height="172" alt="" style="display: block;" /></td>
                                        </tr>
                                        <tr>
                                            <td align="left" valign="top" bgcolor="#2f2f2f" style="padding: 15px 0px 18px 20px; background: #2f2f2f;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                                                <table border="0" cellspacing="0" cellpadding="0" style="width: 288px;">
                                                    <tbody>
                                                        <tr>
                                                            <td align="left" valign="top" mc:edit="banner-title" style="font: normal 24px arial, helvetica, sans-serif; color: #fff; padding-bottom: 5px;">Heading 2</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top" mc:edit="banner-text" style="font: normal 12px arial, helvetica, sans-serif; color: #fff; line-height: 18px; padding: 0px 0px 12px 4px;">Praesent viverra dui in orci pulvinar convallis. Nunc interdum, metus eget adipiscing rutrum, leo quam accumsan tellus, eget . It's easy and hassle free!</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top"><a href="#"><img mc:edit="read-more" src="#" width="128" height="31" alt="" /></a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                &nbsp; &nbsp;</td>
                                        </tr>
                                    </tbody>
                                </table>
                                &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!--Two column 1 End--> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</td>
                            <td width="320" align="left" valign="top">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!--Two column 2 Start-->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <table border="0" cellspacing="0" cellpadding="0" style="width: 320px;">
                                    <tbody>
                                        <tr>
                                            <td align="left" valign="top"><img mc:edit="two-coulmn-image2" src="mobiles.png" width="320" height="172" alt="" style="display: block;" /></td>
                                        </tr>
                                        <tr>
                                            <td align="left" valign="top" bgcolor="#2f2f2f" style="padding: 15px 0px 18px 20px; background: #2f2f2f;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                                                <table border="0" cellspacing="0" cellpadding="0" style="width: 288px;">
                                                    <tbody>
                                                        <tr>
                                                            <td align="left" valign="top" mc:edit="banner-title" style="font: normal 24px arial, helvetica, sans-serif; color: #fff; padding-bottom: 5px;">Heading 3</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top" mc:edit="banner-text" style="font: normal 12px arial, helvetica, sans-serif; color: #fff; line-height: 18px; padding: 0px 0px 12px 4px;">Nunc vel massa metus, vel varius mi. Sed sagittis consectetur nisi, sed imperdiet ipsum interdum non. Nunc consectetur odio et turpis eleifend semper. Pellentesque lorem purus</td>
                                                        </tr>
                                                        <tr>
                                                            <td align="left" valign="top"><a href="#"><img mc:edit="read-more-1" src="images/read-more.png" width="128" height="31" alt="" /></a></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                                &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</td>
                                        </tr>
                                    </tbody>
                                </table>
                                &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!--Two column 2 End--> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</td>
                        </tr>
                        <!--Two column Part End-->
                        <tr>
                            <td>&nbsp;</td>
                        </tr>
                    </tbody>
                </table></td>
            <!--Body Part End--></tr>
        <tr><!--Footer Part Start-->
            <td align="left" valign="top">&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;
                <table border="0" cellspacing="0" cellpadding="0" style="width: 687px;">
                    <tbody>
                        <tr>
                            <td align="center" valign="top" bgcolor="#ffffff" style="background: #fff; padding: 28px 0px 27px 0px;" width="687">&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp;
                                <table border="0" align="center" cellpadding="0" cellspacing="0" style="width: 675px;">
                                    <tbody>
                                        <tr>
                                            <td align="center" valign="top" mc:edit="un-sp-text" style="font: normal 12px arial, helvetica, sans-serif; color: #737373; line-height: 18px;" width="675">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                                <p align="center"><b>Copyright &copy; 2012 Company - Registered &amp; Dales 07765116</b></p></td>
                                        </tr>
                                        <tr>
                                            <td align="center" valign="top" mc:edit="c-right-text" style="font: bold 12px arial, helvetica, sans-serif; color: #737373; line-height: 18px;" width="675">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                                <p align="center">Company Address<br />
                                                    T: 023227 000 201 &nbsp;E: <a href="#">admin@admin.com</a> &nbsp;W: <a href="#">company</a></p></td>
                                        </tr>
                                    </tbody>
                                </table></td>
                        </tr>
                        <tr>
                            <td align="center" valign="top" style="padding: 20px 0px 35px 0px;" width="687">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
                                <p align="center">If you wish to unsubscribe from this email, please click here</p></td>
                        </tr>
                    </tbody>
                </table></td>
            <!--Footer Part End--></tr>
    </tbody>
</table>
<!--Main Part End--> &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; <!--Table Start-->
</body>
</html>

Answer 1

您在代码中打开了很多<table>个标签，但都没有关闭。这意味着如果你愿意的话，每个表都将嵌套在parent-table中。

特别是对于所有这些，对齐将失控。

我建议相应地关闭表标记，并删除它们为某些平均代码创建的 。

HTML电子邮件模板需要表格帮助

1 个答案: