Outlook for Mac (2011): Условные комментарии

Установка: Я пробую свою руку по электронной почте с отзывчивым дизайном. Позвольте мне сказать фронт, я достаточно опытен, что ожидаю, что там будут почтовые клиенты, за которыми я не могу контролировать. Тем не менее, тот, с которым у меня возникают проблемы сейчас, что я хотел бы найти работу, является Outlook 2011 (для Mac).Outlook for Mac (2011): Условные комментарии

Я использую встроенный CSS на основном <table>, чтобы установить минимальную и максимальную ширину, а затем установить изображение заголовка на 100% ширину. Это, очевидно, не удастся в Outlook (создавая HUGE-образ), поэтому я использую условные комментарии, чтобы предоставить клиентам Outlook <table> вокруг первой, которая имеет фиксированную ширину.

Пример: 

<table cellpadding="0" cellspacing="0" border="0" style="margin: 0px 0px 0px 0px; max-width:600px; min-width:150px; width:100%; background-color:#FFFFFF; border:0px;">

Проблема: Я не могу получить Outlook 2011 (один для Mac), чтобы распознавать любые условные комментарии. Кроме того, он не будет обрабатывать стили max и min. Я пробовал тестировать версию mso и mso, IE, даже для не-Windows-машин (<!--[if !(WindowsEdition)>), но ни одна из них не распознается этой версией Outlook (хотя мой почтовый клиент GS3 распознал не-Windows-тест).

Есть ли у кого-нибудь возможность протестировать эту версию Outlook?

источник

2013-05-08 astangelo

@astangelo,

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

После небольшого поискового запроса я узнал, что это странно (и в действительно отличных новостях), Outlook 2011 для Mac использует движок рендеринга Webkit, а не Microsoft Word.

Таким образом, вы не можете настроить таргетинг, используя условные комментарии, которые вы обычно использовали для других версий Outlook на ПК.

Все, что вам нужно сделать, это добавить запрос @media в свои стили головы и указать максимальную ширину, используя (предпочтительно) селектор таблицы ["attribute" = "property"].

Я только что сделал это и протестировал его, и он, наконец, исправил мою проблему.

Удостоверьтесь, что вы используете инструмент вставки CSS для Premailer, и «Проверьте» «Не удалять или с головы», иначе ваш запрос @media не будет проходить, и трюк не будет работать.

Надеюсь, это поможет!

С уважением, Robert

источник

2014-01-14 19:14:36

Это своего рода выстрел в темноте, но стоит попробовать, потому что я на 99% уверен, что он сработает. Outlook 2011 для Mac использует webkit для рендеринга электронной почты. Таким образом, таргетинг webkit с использованием

@media screen and (-webkit-min-device-pixel-ratio:0) { 

body { } 
}

должно работать.

Будьте осторожны, чтобы проверить все предыдущие рабочие почтовые клиенты после этого, потому что вы также можете настроить таргетинг на них.

Дайте мне знать!

источник

2013-06-12 17:45:56 OneEightLeft

Насколько я знаю, нет никакого условного комментария за 2011 год, я пробовал несколько вещей, но не имел радости.

Однако, если вы задаете высоту и ширину изображения в элементе html, оно не будет выглядеть огромным. Затем установите его на 100% в запросе на медиа.

<style> 
@media screen and (max-width: 600px) { 
    .headerimage{ 
    width:100%;!important; 
    height:auto;!important; 
    } 
} 
</style> 

<img src="xxx" height="100" width="600" class="headerimage">

источник

2013-10-25 09:17:17 Mark

Outlook for Mac (2011): Условные комментарии

ответ

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