Как обрабатывать медиа-запросы в электронных письмах HTML в Gmail?

Я отправляю отзывчивые электронные письма в формате HTML со своим веб-сайтом с медиа-запросами, но в Gmail / Inbox max-width в медиа-запросе относится к области просмотра браузера, а не к электронному письму в формате HTML.

Итак, в каждом другом почтовом клиенте мои электронные письма переключаются на отображение на мобильных устройствах под 600 пикселей, в Gmail / Inbox это соединение нарушено.

Есть ли у вас решение, позволяющее использовать медиа-запрос в качестве окна просмотра почты вместо окна просмотра браузера?


gmail html email media-queries inbox
person HeavyNounours    schedule 21.06.2017    source источник
comment
вы установили meta viewport в почтовом HTML?   -  person Sagar V    schedule 26.06.2017
comment
Да: <meta name="viewport" content="initial-scale=1.0" />   -  person HeavyNounours    schedule 26.06.2017
comment
как насчет width=device-width?   -  person Sagar V    schedule 26.06.2017
comment
Уже пробовал, ничего не изменилось: /   -  person HeavyNounours    schedule 26.06.2017
comment
Последний тест был: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">   -  person HeavyNounours    schedule 26.06.2017
comment
Можете ли вы поделиться кодом, который вы пробовали, и снимком экрана, показывающим работу как в Gmail, так и в другой почте (где она хорошо работает)   -  person Sagar V    schedule 26.06.2017
comment
Pastebin: pastebin.com/xYUN0dYD   -  person HeavyNounours    schedule 26.06.2017
comment
Хорошо ли работает Outlook?   -  person Sagar V    schedule 26.06.2017
comment
Нет, почта выглядит отвратительно, но это потому, что Outlook использует механизм рендеринга HTML в формате MS Word.   -  person HeavyNounours    schedule 26.06.2017
comment
В какой почте работает отлично   -  person Sagar V    schedule 26.06.2017
comment
Gmail / Inbox в мобильном приложении   -  person HeavyNounours    schedule 26.06.2017
comment
Это то, что я вижу при изменении размера окна в Outlook в Интернете i.stack.imgur.com/K6PAF. png   -  person Sagar V    schedule 26.06.2017
comment
Отображение правильное, но попробуйте уменьшить размер   -  person HeavyNounours    schedule 26.06.2017
comment
Размер уже изменен до половины экрана   -  person Sagar V    schedule 26.06.2017
comment
Так что в Outlook вроде нормально. Но в Gmail это некрасиво   -  person Sagar V    schedule 26.06.2017
comment
recordit.co/Fid1PpjE5m   -  person HeavyNounours    schedule 26.06.2017
comment
Для меня проблема не в этом. В Outlook все выглядит нормально   -  person Sagar V    schedule 26.06.2017
comment
Но не в Gmail ^^ (см. Видео)   -  person HeavyNounours    schedule 26.06.2017

Ответы (1)


arrow_upward
3
arrow_downward

  1. Рекомендуемый подход: <meta name=viewport content="width=device-width, initial-scale=1">
  2. Избегайте minimum-scale, maximum-scale, user-scalable.
person richardev    schedule 02.07.2017
comment
Попробую в понедельник! - person HeavyNounours; 02.07.2017
comment
Не работает: / Проблема в том, что браузер обрабатывает медиа-запрос с шириной браузера, а не с шириной просмотра почты ... Я думаю, нормальная обработка, но не может правильно работать в веб-почте - person HeavyNounours; 03.07.2017