HTML电子邮件按钮不在同一行答案

【问题标题】：HTML Email button not staying on the same lineHTML电子邮件按钮不在同一行
【发布时间】：2016-06-06 22:38:58
【问题描述】：

在这个 html 电子邮件按钮上，特殊字符 (») 跳到 Outlook 中的文本下方。我试过 display: inline;，改变行高、文本对齐和宽度。似乎没有任何工作。我只是希望那些特殊字符与文本保持在同一行。

HTML：

<table align="center">
<tr><td height="15px">&nbsp;</td></tr>
<tr>
<td>
<div>
  <a href="https://www.stuff.com"
   style="background-color:#97d700;border-radius:4px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:16px;font-weight:bold;line-height:40px;text-align:center;text-decoration:none;width: 250px; -webkit-text-size-adjust:none;”>Shop Now &#187; </a>
</div>
</td>
</tr>
</table>

【问题讨论】：

在这种情况下不应该换行，除非这是在一个非常狭窄的空间中。可以显示结果的屏幕截图吗？
尝试在style的末尾用"替换”！
我的所有测试都没有重复您的问题 - Outlook 上的所有测试都将其呈现在同一行。正如@sebastionbrosch 所说，您需要替换末尾的双引号，因为它被读取为特殊字符而不是样式属性的结尾。

标签： html html-email

【解决方案1】：

尝试使用&nbsp;（不间断空格）而不是普通空格。这应该将单词和符号粘合在一起。

【讨论】：

我试过了，它把单词now和特殊字符放在第二行
嗯，您可以在“Shop”和“now”之间添加另一个 nbsp，但这里肯定有不同的情况，您可以显示屏幕截图吗？