Android 安卓6上的表行未采用100%宽度

我在一封html电子邮件中使用了下面的代码，除了Android 6.0 Gmail，它在所有电子邮件客户端中都能正常工作！蓝色的“联系我们”按钮没有占据100%的宽度

有什么想法吗

第一个屏幕截图显示了它在真实设备上的样子，而第二个屏幕截图来自litmus，这是不正确的，但这就是我试图让它看起来的样子

守则：

.cta{
文本对齐：左对齐；
垂直对齐：中间对齐；
}
@仅介质屏幕和（最大宽度：414px）{
.手机{
宽度：100%！重要；
填充：0！重要；
边距：0！重要；
}

联系我们

不要使用

宽度：100%；

尝试使用

宽度：100vw；

某些版本的Android和Gmail不使用媒体查询

这就是为什么蓝色联系人按钮只占据Android屏幕的1/3，但在IOS设备上它占据100%的屏幕。IOS将尊重媒体查询，Android将使用表中的

width=“33%”

：

<table class="mobile" cellpadding="0" cellspacing="0" border="0" width="33%" align="right" style="font-family: Arial, Helvetica, sans-serif;">

由于您不会像预期的那样在堆栈溢出上发布其余代码，因此我无法提供解决方法的建议，因为我不确定您正在尝试做什么。至少您现在知道了它不起作用的原因

---

祝你好运。

解决这一问题的一个好办法是强制Android 5.1和6.0显示桌面版本的电子邮件。下面的代码片段需要一个600x1的透明png作为全宽间隔符。此间隔符将隐藏在所有支持媒体查询并允许移动视图渲染的移动客户端上

  <tr style="line-height: 1px; mso-line-height-rule: exactly;" class="mobilehide">
    <td align="center" style="min-width:600px;font-size:1px; line-height: 1px; mso-line-height-rule: exactly;">
      <img src="images/android-spacer.png" alt="" width="600" height="1" style="display: block;" border="0">
    </td>
  </tr>

这应该添加到最外层表的结束标记之前（结束正文之前的最后一个）

您发布的代码与您发布的图像不匹配。共享您的html代码会有帮助。您是指底部的灰色框吗？将其包含在代码中没有帮助。这只是另一个

@gWallyth您发布的表被包装在

标记中。缺少父表。请发布完整的html代码，以便我们能够帮助您p你。好了！我刚刚添加了此

@gwally的父级。谢谢你的帮助。是否可以避开它？代码太长，无法在此处发布，其余部分不会影响此蓝色按钮。但我将添加更多代码。谢谢you@Adam，它花了数小时说服您发布足够的代码，以便我们可以看到问题所在我不再花时间试图说服你堆栈溢出的价值。祝你好运找到解决方案。这是一个好方法！它在移动设备中显示电子邮件，不支持桌面等媒体查询，但是

mobilehide

类怎么办？我应该添加哪些属性？很高兴它有帮助。抱歉，我应该提到这个类，我只使用了

display:none！重要的
属性，因此它会在所有其他移动视图上隐藏间隔符，而不是在头部使用css。它对某些电子邮件客户端不起作用。谢谢
        </td>
      </tr>
    <!-- add here -->
    </table>
  </body>
</html>