Question

嘿大家，

我有3个元素的问题，通常会对gmail应用程序及其最新更新做出响应。不能再使用display：none了。如何使其静态或正常响应？

这是代码：

<style>
@media only screen and (max-width : 480px){
      .paddingTop10{
           padding-top:10px !important;
      }
@media only screen and (max-width : 480px){
      .fullWidthImg img{
           width:100% !important;
           height:auto;
      }
@media only screen and (max-width : 480px){
      .fullWidth{
           width:100% !important;
           height:auto;
      }
</style>

 <table width="100%" cellpadding="0" cellspacing="0" border="0">
              <tr>
                <td>
                  <table class="fullWidth" align="left" width="440" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
                    <tr>
                      <td>
                        <table class="fullWidth" align="left" width="196" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
                          <tr>
                            <td class="paddingTop10 mobileHide fullWidthImg">
                              <a href="http://flowerbeauty.com/holiday-kits/detail/82/flower-eyem-ready-collection/?&amp;utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide">
                                <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/851f9965-7d09-41a8-b298-4069b24371aa.png" width="196" alt="" border="0" style="display:block;">
                              </a>
                            </td>
                            <!--[if !mso 9]><!-->
                            <td style="display: none;" class="fullWidthImg fullHide mobileShow">
                              <a href="http://flowerbeauty.com/?utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide">
                                <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/7b28fcdd-e9f7-4f06-93ab-ca129601423f.png" alt="Shop Now" title="Shop Now" width="195" style="max-height:0; width: 0; display:block; border-spacing:0;">
                              </a>
                            </td>
                            <!--<![endif]-->
                          </tr>
                        </table>
                        <!--[if (gte mso 9)|(IE)]>
                      </td>
                      <td valign="top" style="border-top:1px solid #dcddde;border-bottom:1px solid #dcddde;">
                        <![endif]-->
                        <table class="fullWidth" align="right" width="244" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
                          <tr>
                            <td class="paddingTop10 fullWidthImg">
                              <a href="http://flowerbeauty.com/eyes/detail/72/flower-endless-wear-eye-color-ultimate-eye-color/?utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide">
                                <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/22cab22e-0182-45fd-b706-3d775d79f4d0.png" width="244" alt="" border="0" style="display:block;">
                              </a>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </table>
                  <!--[if (gte mso 9)|(IE)]>
                </td>
                <td valign="top" style="border-top:1px solid #dcddde;border-bottom:1px solid #dcddde;">
                  <![endif]-->
                  <table class="fullWidth" align="right" width="195" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;">
                    <tr>
                      <td class="paddingTop10 fullWidthImg">
                        <a href="http://flowerbeauty.com/holiday-kits/detail/84/flower-shadow-art-palette/?utm_source=camonitor&amp;utm_medium=email&amp;utm_campaign=giftguide">
                          <img src="https://gallery.mailchimp.com/93236a445e119a73252cba6e4/images/f34f8189-facf-4d29-bd97-6c0bebb442a7.png" width="195" alt="" border="0" style="display:block;">
                        </a>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>

Answer 1

您可以尝试使用CSS片段来处理需要从gmail隐藏的元素。你是对的，一个简单的显示：没有一个不起作用！

style="width:0; overflow:hidden;float:left; display:none"

然后在顶部的媒体查询中使用css，以便在显示它的情况下还原所有这些内容。

Gmail app 3元素响应

1 个答案: