移动邮件客户端AquaMail连续 失效 求不使用white-space:pre的替代方案

以下方案均无需使用style='white-space:pre'，可完美兼容AquaMail及其他主流邮件客户端：

• 方案1：改用表格布局（最稳妥，全客户端兼容）
  你当前需要对齐的内容属于结构化分栏数据，直接使用HTML表格实现布局是HTML邮件场景下兼容性最高的方案，从根源避免空格合并问题，所有主流客户端（包括AquaMail、各版本Outlook、桌面/移动端浏览器）均可正常解析。
  示例代码参考：

<table border="0" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td width="18%">06/16/21 12:24:40am </td>
    <td width="1%">|</td>
    <td width="35%">broadband.actcorp.in</td>
    <td width="1%">|</td>
    <td width="30%">https://website.com/index3f35.html?page_id=8..</td>
    <td width="15%">◄ India ► Secunderabad, Telangana</td>
  </tr>
  <tr>
    <td>06/16/21 01:20:28am </td>
    <td>|</td>
    <td>malware-hunter.census.shodan.io</td>
    <td>|</td>
    <td>INVALID: []</td>
    <td>◄ United States ► San Diego, California</td>
  </tr>
  <!-- 剩余行复用相同结构即可 -->
</table>

可根据实际显示需求调整每列的width数值，对齐效果稳定，无需额外填充空格。

• 方案2：零宽字符间隔 （改动最小，无需调整原有结构）
  AquaMail仅会合并连续的 序列，你只需要在每两个 中间插入一个零宽不换行空格打断连续序列即可，零宽字符不会在任何客户端产生可见宽度，也不会影响原有布局效果。
  比如需要5个连续空格的场景，将原有代码     替换为     即可，仅需修改生成连续空格的逻辑，原有其他代码无需调整。

• 方案3：内边距模拟空格宽度
  如果仅需要固定长度的空白、不需要严格对齐，可以用空行内元素加内边距实现空格效果，兼容性表现良好：

<span style="padding-right: 20px; display: inline-block;"></span>

调整padding-right的数值即可控制空白宽度，适配不同场景需求。

内容的提问来源于stack exchange，提问作者MKANET