Столбец электронной почты Gmail
Я знаю, что эта лошадь только что была избита до смерти.. но у меня проблема с табличным пространством Gmail, которая просто накачивает меня сегодня утром.
<td valign="top">
<img src="###/enewsletter_layout_v3_18.jpg" alt="" />
<table cellpadding="0" cellspacing="0" style="background: #000; width: 700px; margin: 0 0 0 8px; text-align: center; color: #fff;">
<tr>
<td valign="top" style="background: #890000; height: 50px; padding: 10px 15px; font-size: 24px; font-weight: bold;">
New Patient Special Offer <br/>
Save $$$
</td>
</tr>
<tr>
<td valign="top" style="background: #000; height: 50px; padding: 5px 15px 15px 15px;">
<h1 style="font-size: 24px; font-weight: bold;">Do you have a question?</h1>
If you have read anything in this newsletter and have any questions or would like to
discuss further, please contact <br/>
The Centre at (555) 555-5555
</td>
</tr>
</table>
</td>
Независимо от того, что я делаю, первое изображение в таблице (layout_v3_18) всегда имеет интервал между ними. Около 2-3 пикселей пробела в Gmail. Происходит на пару других изображений в письме, но все остальное отлично работает. Независимо от того, сколько раз я сравниваю таблицы, это не сработает.
Мысли?
Ответы
Ответ 1
Я действительно сталкивался с этой проблемой много недавно. Код, который мы нашли, который работает лучше всего (прочитайте: выглядит в большинстве почтовых клиентов) выглядит следующим образом:
<img src="###" style="display: block;" />
Просто добавьте отображение: блок для каждого изображения и устранит проблему.
Ответ 2
В ответ на мой собственный вопрос (в случае, если у кого-то есть аналогичная проблема), я наконец нашел проблему (или решение в любом случае).
Я добавил style="float: left"
к самому изображению, которое волшебным образом зафиксировало его.
Альтернативно, использование "display: block" имеет тенденцию иметь аналогичный результат, если используется на всех изображениях, но поплавок, похоже, очищает интервал специально для GMail, когда он отлично работает в другом месте.
Ответ 3
Gmail может добавлять пустое пространство вокруг любой таблицы, включая вложенные таблицы.
Хотя немного взломать, добавив следующее в качестве встроенного стиля в таблицу, удаляет пустое пространство:
style="font-size:0.0em;" ...
Ответ 4
Если бы та же проблема, я добавил ниже строки
style="line-height:1px;"
в теге td выше.
В моем html-шаблоне в списке файлов.
Ответ 5
Использование display:block
на изображениях уменьшило некоторое пространство между ячейками изображения, но не удалило все промежутки.
Добавление устаревших атрибутов cellpadding/cellspacing в родительской таблице (<table border="0" cellpadding="0" cellspacing="0">
) исчезли последние пробелы.
Ответ 6
У меня была такая же проблема, и все эти варианты были выше, но ничего не получилось. Я сделал высоту стола короче и удалил все расстояния.