Я отправляю электронное письмо из MS Outlook (2013), и оно отлично работает, но в приложении GMail для Android (это также бывает для iOS) существует разрыв между строками (строками).
Как вы, наверное, знаете, MS Outlook изменяет HTML при отправке электронного письма (вы можете видеть, что отправленный HTML просто сохраняя электронное письмо как HTML).
Ради простоты я создал простой шаблон HTML, чтобы вы моглипомогите мне найти проблему здесь.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Gmail APP issue</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<table style="border:0px;border-spacing:0px;border-collapse:collapse;">
<tbody>
<tr>
<td>
<p style="margin:0;">THIS CELL (TD) HAS TOP AND BOTTOM EXTRA SPACE WHEN RECEIVING FROM MS OUTLOOK</p>
</td>
</tr>
<tr>
<td>
<p style="margin:0;">THIS CELL (TD) HAS TOP AND BOTTOM EXTRA SPACE WHEN RECEIVING FROM MS OUTLOOK</p>
</td>
</tr>
</tbody>
</table>
</body>
</html>
До сих пор я безуспешно пробовал следующее:
- Добавил
line-height:0 к элементу <td> и затем мой пользовательский line-height к <p> элемент.Это самое близкое, что я могу получить, но <td> не отображается в MS Outlook, так как нам нужно использовать единицы измерения.С другой стороны, если мы используем единицы (то есть 0px), то у нас возникает та же проблема при получении электронной почты в приложении. - Добавлен
min-width к таблице и ячейкам таблицы. - Добавлены атрибуты cellspacing и cellpadding, но в этом нет необходимости, потому что MS Outlook добавляет их.
У меня ничего не работает.
Я собираюсь добавитькрасный фон для элемента <p> и зеленый для элемента <td>, чтобы вы могли видеть, что здесь происходит.
Вот как электронная почта отображается в MS Outlook:
и вот как это отображается в приложении Gmail: 
Вы можете увидеть разрыв, который добавляет Gmail.Возможно, текст слишком длинный, но это не имеет значения, просто хотел ввести что-то описательное.
Я буду продолжать пытаться, пока он не будет решен.Если бы кто-то мог помочь мне, я был бы очень признателен.
РЕДАКТИРОВАТЬ: Я собираюсь вставить обработанный HTML, сгенерированный каждым клиентом (из приведенного выше шаблона HTML), чтобы сделать его прощечтобы определить проблему.Я собираюсь вставить только вывод ячейки таблицы:
Это HTML-код, отправленный MS Outlook :
<tr>
<td style="padding:0in 0in 0in 0in">
<p class="MsoNormal"><span style="font-size:13.5pt;font-family:"Times New Roman",serif;
color:black">THIS CELL (TD) HAS TOP AND BOTTOM EXTRA SPACE WHEN RECEIVING
FROM MS OUTLOOK</span></p>
</td>
</tr>
Как вы можете заметить, MS Outlook добавляетЭлемент <p> для переноса содержимого таблицы, хотя мы используем вместо этого другой элемент ( div , span ), как предлагали некоторые пользователи.
Также обратите внимание, что MSOutlook убрал style="margin:0;, который мы встроили в элемент <p>, но класс MsoNormal избегает верхнего и нижнего полей, поэтому MS Outlook не добавляет здесь пробелов.
Так Gmail (Android) обрабатывает HTML-код, полученный из MS Outlook
<tr>
<td style="padding:0cm 0cm 0cm 0cm">
<p class="MsoNormal"><span style="font-size:13.5pt;font-family:"Times New Roman",serif;color:black">THIS CELL (TD) HAS TOP AND BOTTOM EXTRA SPACE WHEN RECEIVING FROM MS
OUTLOOK<u></u><u></u></span></p>
</td>
</tr>
И этот стиль применяется к элементу <p>:
.msg-8292648110214437287 p {
margin-right: 0cm;
margin-left: 0cm;
font-size: 12.0pt;
font-family: "Times New Roman",serif;
}
msg-8292648110214437287 представляется автоматически сгенерированным Gmail классом.Как видите, поля применяются только слева и справа, однако они не применяются сверху и снизу.
По умолчанию применяются поля сверху и снизу:
p {
display: block;
margin-block-start: 1em;
margin-block-end: 1em;
margin-inline-start: 0px;
margin-inline-end: 0px;
}
Таким образом, пропуски - это поля наверху и поле на полях.
Что я пробовал:
- Добавлено
p { margin:0px!important; } в теге <style> - Добавлен
font-size:0px к элементу <td> (и добавьте нужный элемент в промежуток, окружающий текст), чтобы избавиться от поля, но он также не работает. - То же самое для строки-высота и т. д.
Надеюсь, это редактирование поможет, здесь нужны некоторые знания в области Gmail.Это работает в GMail (Web), что может быть подсказкой.
Опять же, это занимает больше времени, чем я ожидал, и я был бы очень признателен за вашу помощь.Спасибо.