0

现在一直在努力解决这个问题,这真的让我很烦恼。基本上我有一些我一直在研究的电子邮件模板,它们在所有客户端(Litmus 测试)上都可以正常工作,除了专门在 iOS 上的 Gmail,Android 也可以正常工作。我遇到的问题是我希望我所有的表格都是 100% 的宽度,所以它们都是相同的大小,但是 gmail 似乎根据里面的内容调整了表格的大小。

这是我的代码的一部分:

<tr class="module bg-white" style="background-color:#fff;color:#23282b">
<td>
    <table class="container" cellpadding="0" cellspacing="0" border="0" role="presentation" width="100%"
        style="margin:0 auto;width:100%!important;max-width:600px!important">
        <tr>
            <td class="card-wrapper" align="center" valign="top" style="padding:0 15px 10px">
                <table cellpadding="0" cellspacing="0" border="0" role="presentation" width="100%">
                    <tr>
                        <td class="card-content bg-white border-lightgray"
                            style="padding:30px 20px 20px;background-color:#fff;color:#23282b;border:solid 1px #eee">
                            <h2
                                style="font-family:GTAmerica-Regular,Helvetica,Arial,sans-serif;margin:0 0 20px;font-size:18px;font-weight:700;line-height:22px">
                                YOUR DELIVERY DETAILS</h2>
                            <table class="delivery-details" cellpadding="0" cellspacing="0" border="0"
                                role="presentation" width="100%"
                                style="width:100%!important;max-width:600px!important">
                                <tr>
                                    <td style="vertical-align:top;padding-right:8.5px;padding-left:0">
                                        <h3
                                            style="font-family:GTAmerica-Regular,Helvetica,Arial,sans-serif;margin:0 0 15px;font-size:16px;font-weight:700;line-height:22px">
                                            Delivery Service</h3>
                                    </td>
                                    <td style="vertical-align:top;padding-right:0">
                                        <p
                                            style="font-family:GTAmerica-Regular,Helvetica,Arial,sans-serif;margin:0 0 10px;font-size:16px;font-weight:400;margin-bottom:15px;line-height:22px">
                                            Next Day</p>
                                    </td>
                                </tr>
                                <tr>
                                    <td style="vertical-align:top;padding-right:8.5px;padding-left:0">
                                        <h3
                                            style="font-family:GTAmerica-Regular,Helvetica,Arial,sans-serif;margin:0 0 15px;font-size:16px;font-weight:700;line-height:22px">
                                            Delivery Address</h3>
                                    </td>
                                    <td style="vertical-align:top;padding-right:0">
                                        <p
                                            style="font-family:GTAmerica-Regular,Helvetica,Arial,sans-serif;margin:0 0 10px;font-size:16px;font-weight:400;margin-bottom:15px;line-height:22px">
                                            Fake Name <br>Fake House <br>Fake Street
                                            <br>Fake Town <br>UK <br>Fake Postcode</p>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</td>

在我的手机上看起来是这样的:

iOS 15 gmail 上的电子邮件结果

有没有什么办法解决这一问题?在所有其他客户端上,它扩展到 100% 没问题,谢谢!

4

1 回答 1

0

这听起来可能是由于这个错误,Gmail向s 和s添加了一个.munged类。<table><td>width:auto!important

一个解决方案是min-width:100%为每个可能受影响<table>的人添加一个。<td>

于 2022-02-17T14:47:59.747 回答