Gmail中的基础电子邮件出错

Question

我正在开发一个使用电子邮件基础的响应式电子邮件营销。

我已经验证了所有电子邮件客户端，但我遇到了Gmail问题，特别是在Android上。

显然，有些东西是在每个表之间添加空白。

这个问题有什么解决方案吗？

下面是我在codepen中的代码的链接（代码是大到这里发布）和显示错误的打印。

谢谢

https://codepen.io/AciMatta/pen/ZjRJwm

                    <table class="row" style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                  <tbody>
                    <tr style="padding: 0;vertical-align: top;text-align: left;">
                      <th class="small-12 large-12 first columns no-padding" style="padding: 0 !important;">
                        <table style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                          <tbody>
                            <tr style="padding: 0;vertical-align: top;text-align: left;">
                              <th>
                                <img src="http://placehold.it/500x200.jpg" alt="Reinventa la forma de jugar" width="650" height="187" style="outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;width: 100%;max-width: 100%;clear: both;display: block;">
                              </th>
                            </tr>
                          </tbody>
                        </table>
                      </th>
                    </tr>
                  </tbody>
                </table>

Answer 1

我的声誉不允许我发表评论。您是否尝试过以下方法：

table .row {
   margin: 0;
   padding:0;
}

要么

table .row {
   margin-top: 0;
   padding-top:0;
}

希望这可以帮助...

Answer 2

您在表行中使用TH。尝试把style="margin:0px; padding:0px;"，看看是否有帮助。

                    <table class="row" style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                  <tbody>
                    <tr style="padding: 0;vertical-align: top;text-align: left;">
                      <th class="small-12 large-12 first columns no-padding" style="padding: 0 !important;">
                        <table style="border-spacing: 0;border-collapse: collapse;padding: 0;vertical-align: top;text-align: left;">
                          <tbody>
                            <tr style="padding: 0;vertical-align: top;text-align: left;">
                              <th style="margin:0px; padding:0px;">
                                <img src="http://placehold.it/500x200.jpg" alt="Reinventa la forma de jugar" width="650" height="187" style="outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;width: 100%;max-width: 100%;clear: both;display: block;">
                              </th>
                            </tr>
                          </tbody>
                        </table>
                      </th>
                    </tr>
                  </tbody>
                </table>

TH设计用于标题（表格标题）。字体将以粗体显示并在其周围添加一些空间。除非您使用它将列拆分为行，否则我建议坚持使用表数据（td）。

希望以上有所帮助。

Answer 3

希望这可以帮助。

桌子上 ：

cellspacing="0"

在每张图片上：

style="display:block;"