2013-05-31 1 views
4

Я разработал специальный шаблон электронной почты, который использует медиа-запрос для целевых устройств размером менее 480 пикселей. Электронная почта выглядит и отображается в каждом почтовом клиенте и платформе - Gmail, Yahoo !, Hotmail, Apple Mail, Thunderbird, Outlook 2003 и т. Д. - за исключением Outlook 2007 до 2013 года.Outlook 2007 до 2013 Отображение запросов устройств для устройств

Outlook 2007 - 2013 странно поднимает медиа-запрос и стилирует электронное письмо с данными объявлений css. Когда я удаляю медиа-запрос, он отлично отображается. Любая идея, как я могу иметь Outlook игнорировать медиа-запрос?

Ниже приведен медиа-запрос, а также ссылка jsFiddle. Измените max-device-width на max-width, чтобы увидеть медиа-запрос в действии.


jsFiddle: http://jsfiddle.net/danimalnelson/uQ7kg/

@media only screen and (max-device-width: 480px) { 

ответ

13

You может заставить Microsoft игнорировать части кода с:

<!--[!if gte mso 9]><!--> 
// This will be ignored by Outlook 2007 
<![endif]--> 

<!--[!if gte mso 15]><!--> 
// This will be ignored by Outlook 2013 
<![endif]--> 

<!--[if !mso]><!--> 
// This will be ignored by all Microsoft Outlook 
<!--<![endif]--> 

Вот Outlook version numbers

-1

Следуйте моим советам, не изобретать колесо, использовать некоторый шаблон стартера уже протестировали много раз с большим количеством ошибок уже исправить как Antwort

+0

Не на самом деле реагирует .. http://see.kirkstrobeck.com/ShP1 –

+0

Не действительно отвечая на вопрос под рукой .. . – rinogo

0

Я привести к считаю, что:

<!--[!if gte mso 9]> 
// This WILL be rendered by Outlook 2007 as 'gte' means greater than or equal to 
<![endif]--> 

<!--[!if gt mso 9]> 
    // This WON'T be rendered by Outlook 2007 as 'gt' means greater than 
<![endif]--> 

Джон. У вас есть ссылка на то, где вы нашли ресурс относительно того, какой номер mso относится к какой версии Outlook?

Есть ли страница Microsoft где-нибудь с окончательным списком номеров mso?

Самый полезный ресурс, у меня до сих пор люблю этот немецкий вики-страница: http://de.wikipedia.org/wiki/Conditional_Comments

+0

Номера версий Outlook: http://templates.mailchimp.com/development/css/outlook-conditional-css – John

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