Дополнительный интервал между строками в Outlook 2010

Я использую таблицу для фальсификации маркированного списка в своем HTML-письме. Он отлично смотрится в каждом клиенте, кроме Outlook 2010, который добавляет дополнительный пробел между каждой строкой:

правильный против внешнего вида

Стол cellpadding а также cellspacing установлен в 0, и я попытался явно установить line-height в каждой строке таблицы.

Код:

<table width="100%" style="table-layout: fixed; margin-bottom: 21px; border: none;" cellpadding="0" cellspacing="0">
  <tr>
    <td width="15" valign="top" style="border-collapse: collapse;">&bull;</td>
    <td width="485" valign="top" style="border-collapse: collapse;">Satisfy the PSD2 requirement for Strong Customer Authentication (SCA)</td>
  </tr>
  <tr>
    <td width="15" valign="top" style="border-collapse: collapse;">&bull;</td>
    <td width="485" valign="top" style="border-collapse: collapse;">Help you comply with GDPR and minimize the risk of potential penalties</td>
  </tr>
  <tr>
    <td width="15" valign="top" style="border-collapse: collapse;">&bull;</td>
    <td width="485" valign="top" style="border-collapse: collapse;">Reduce friction to improve your user experience</td>
  </tr>
</table>

2 ответа

Проблема заключается в margin-bottom стиль применяется к родителю table, Outlook применяет этот стиль к дочерним элементам, поэтому каждый тд имеет нижнее поле 21px, Удалите нижнее поле и используйте пустую строку таблицы, чтобы подделать нижнее поле:

<table width="100%" class="list-table" style="table-layout: fixed; border: none;" cellpadding="0" cellspacing="0">
  <tr>
    <td width="15" valign="top" style="border-collapse: collapse;">&bull;</td>
    <td width="485" valign="top" style="border-collapse: collapse;">Satisfy the PSD2 requirement for Strong Customer Authentication (SCA)</td>
  </tr>
  <tr>
    <td width="15" valign="top" style="border-collapse: collapse;">&bull;</td>
    <td width="485" valign="top" style="border-collapse: collapse;">Help you comply with GDPR and minimize the risk of potential penalties</td>
  </tr>
  <tr>
    <td width="15" valign="top" style="border-collapse: collapse;">&bull;</td>
    <td width="485" valign="top" style="border-collapse: collapse;">Reduce friction to improve your user experience</td>
  </tr>
  <tr>
    <td width="100%" height="21" colspan="2" style="border-collapse: collapse;">&nbsp;</td>
  </tr>
</table>

«Удалить нижнее поле» у меня не работает. В итоге я добавил пустую строку в качестве последней строки, например:

      <tr>
   <td style="height:0;font-size:0;line-height:0;">&nbsp;</td>
</tr>
Другие вопросы по тегам