Можно ли сделать адаптивную верстку письма с тремя колонками, которая будет работать и в outlook?

Question

[mishapsv]

Сделал верстку с тремя колонками, они перескакивают друг под друга на моб. устройствах. Все прекрасно.
Но вот в аутлуке 2010 все едет.
Это реально в принципе?
Может быть поделитесь шаблонами, которые используете?

Answer 1

[Сергей Горячев]

Проще простого.
Для Outlook показываем таблицу, для остальных обычная div-ная верстка.

<!--[if gte mso 9]><table width="600" border="0" cellspacing="0" cellpadding="0"><tr><td><![endif]--> 
Блок1 
<!--[if gte mso 9]></td><td><![endif]-->
Блок2 
<!--[if gte mso 9]></td><td><![endif]-->
Блок3
<!--[if gte mso 9]></td></tr></table><![endif]-->

Answer 2

[Константин Величко]

table
codepen.io/Zoxon/pen/JXZQvv

Comments

[mishapsv]

Константин Величко Спасибо. Но можно ли сделать, чтобы при просмотре на небольших экранах колонки не сжимались, а шли в столбик друг за другом?

[Константин Величко]

1. Попробовать показывать 1 колонку, а вторую продублировать ниже и показывать ее
2. Попробовать применить display: block к таблице и ее элеметам

[Константин Величко]

Вообще оутглюк та еще боль, он для рендеринга использует то ли движок ворда то ли сильно урезанный и древний IE

[Константин Величко]

Нагуглил такие сервисы вам в помощь
1. https://www.campaignmonitor.com/css/
2. templates.mailchimp.com/resources/email-client-css...