HTML电子邮件无法在Google Apps / Gmail中正确显示

时间:2013-06-11 07:34:37

标签: cross-browser html-email email-client

我的网络应用程序向用户发送基于HTML的电子邮件。

我已经创建了一个HTML电子邮件模板(基于MailChimp提供的模板,据说可以在任何浏览器/电子邮件客户端中使用)。

当我使用SendGrid发送时,它会在我的 Apple iPhone 4 上完美显示,但在 Gmail / Google Apps中测试时却无法正确显示同时使用Firefox和谷歌浏览器

无法正常使用的HTML代码段:

<tr>
    <td align="center" valign="top" style="padding-top:0;">
        <table border="0" cellpadding="15" cellspacing="0" class="templateButton3">
            <tr>
                <td valign="middle" class="templateButtonContent">
                    <div mc:edit="std_content01">
                        <a href="http://www.url.com/blah" target="_blank">Button Text</a>
                    </div>
                </td>
            </tr>
        </table>
    </td>
</tr>

这里应用的CSS是:

.templateButton3{
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    /*@editable*/ background-color:#d34843;
    /*@editable*/ border:0;
    border-collapse:separate !important;
    border-radius:3px;
}

我在这里做错了什么?这是使用Google Apps / Gmail的烦人副作用吗?

2 个答案:

答案 0 :(得分:5)

所有CSS必须在td上内嵌。这将为您完成:http://beaker.mailchimp.com/inline-css

MailChimp会自动执行此操作,如果您不使用MC但使用其模板,则必须自行内联CSS。

答案 1 :(得分:0)

为了支持samantha所说的内容,ios将考虑标签之间的内容.. gmail或谷歌应用程序不会。