2012-02-16 4 views
1

У меня есть шаблон электронной почты, который прекрасно работает в большинстве почтовых клиентов (или по крайней мере приемлемые), но полностью распадается в Outlook 2007 и Outlook 2010.HTML таблица электронной почты сломанной в Outlook, 2007 и 2010

Я знаю, что эти версии Outlook используют механизм рендеринга Word вместо IE.

Я слышал об ошибке пролома страницы Outlook, но это влияет только на вертикальное расстояние. Моя проблема в горизонтальном расстоянии.

Код:http://jsbin.com/alagih/edit#html,liveb

Результаты тестов для всех основных почтовых клиентов:http://artletic.createsend.com/screens/y/F2B9C33F1297A73F

Перспективы 2007 Скриншот: Outlook 2007 screenshot

+0

Начать отладку: удалить все изображения, размещенные на amazonaws. Затем начните удаление определений стилей. В конце концов вы найдете тот, который делает Word barf. –

+0

Спасибо @ marc-b. Я пробовал несколько вариантов, но надеялся избежать тестирования 50 раз. Я использую тестирование CampaignMonitor (которое использует Litmus). $ 5 за тест хорош для нескольких, но при отладке это быстро складывается! –

+1

Не должно быть никакой реальной причины, по которой вы не можете взломать сценарий быстрого теста с жестким кодированием raw html и работать с ним на свой собственный почтовый ящик без привлечения третьих лиц. Если вы не можете воспроизвести его с помощью этого отдельного сценария, начните кричать на продавцах. –

ответ

1

Вы никогда не установить ширину таблицы, содержащей ваше тело сообщение.

Он установлен в <table border="0" width="">

Что касается вашего «franco.jpg» изображение, выглядит прогноз игнорирует маржу инлайн на img тега. Попробуйте создать таблицу из двух столбцов для своего содержимого и либо оберните изображение в div, либо придайте ему правильный запас, либо оберните текстовое содержимое в div и дайте ему левое поле. По какой-то причине Outlook не нравится заполнение.

Кроме того, поскольку Outlook 2007 и, возможно, 2010 использует Word в качестве механизма рендеринга, он будет игнорировать определенные стили, такие как background-image (background-position, тоже), однако он примет `bgcolor 'и' background-color '.

Самый быстрый способ протестировать Outlook 2007/2010 - это открыть его в MS Word. Он должен отображаться близко к тому, что будет отображаться в этих версиях Outlook.

Не знаете, что вызывает =E2=80=9D.

Если вы действительно должны использовать фоновое изображение, попробуйте this hack.

+0

[Есть новый «взлом» для включения фоновых изображений] (http://www.campaignmonitor.com/blog/post/3363/updated-applying-a-background-image-to-html-email) на тот же сайт, на который ссылается ваша оригинальная ссылка «this hack». –

5

Я нашел это специально для электронных писем HTML в Outlook 2007, вы должны установить параметры ширины как в теге, так и в встроенном CSS.

так, например <td width="150px" style="width: 150px;">

+0

Помог мне с перспективой 2010 тоже. Хороший –

2

Попробуйте добавить ширину к любому тд, который содержит изображение.

Пример:

<td width="150"> 
    <img src="/img/image.jpg" width="150" height="150"> 
</td> 

Кроме того, убедитесь эти изображения установлены в display: block.

Смежные вопросы