电子邮件签名（适用于移动设备，特别适用于 Gmail 应用程序）答案

【问题标题】：Email Signature (Mobile-friendly specially for Gmail App)电子邮件签名（适用于移动设备，特别适用于 Gmail 应用程序）
【发布时间】：2016-09-01 00:21:45
【问题描述】：

我正在尝试专门为 Gmail 应用程序创建电子邮件签名。很遗憾，媒体查询与 Gmail 应用程序不兼容。所以我尝试从http://webdesign.tutsplus.com/tutorials/creating-a-future-proof-responsive-email-without-media-queries--cms-23919 学习 fluid hybrid 方法来创建移动友好的电子邮件签名。下面的链接只是示例的一部分。

所以问题是，当我尝试在 jsbin 中将窗口拉伸为更小（导致宽度更小）时。

a) 有很多单词的第一部分会自动重新调整以适应较小的宽度，但对于

b) 第二部分带有 twitter、fb 和 googleplus 标志。当我尝试拉伸它时，图标不会根据较小的宽度重新调整，而是转到下一行，而不是与 wwe.com 保持在同一行。

如果有人知道如何解决该问题，请提供帮助，这样即使窗口被拉伸到最小宽度，图标仍然会粘在同一行。（这也可能证明对移动设备友好）

【问题讨论】：

【解决方案1】：

最好的方法是使用 Font Awesome 图标并使用 vw 设置字体

font-size:4vw;

这样做会根据宽度减小图标大小。

或

您为什么不尝试将内容保存在表格中。并以百分比形式给出表格宽度。并根据需要使用媒体查询来放置它们。

或

对于不同的屏幕尺寸，您可以有 2 个不同的表格。并使用媒体查询切换可见性。

【讨论】：