Белые полосы https://ru.stackoverflow.com/questions/662113/%D0%91%D0%B0%D0%B3-outlook-2016
Ссылка на типичные проблемы при верстке для outloook – https://stripo.email/ru/blog/common-email-rendering-issues-in-outlook-and-how-stripo-solves-them/
Проверить поддержку https://www.campaignmonitor.com/css/color-background/background-image/
Полезные ссылки
https://sendsay.ru/blog/kakim-dolzhien-byt-razmier-pisma-dlia-email-rassylki/
1. Выровнять контент сверху:
Обязательно задаем фиксированную высоту
|
1 |
<td valign="top" style="vertical-align: top; height: 100px"></td> |
2. Кнопка с закруглёнными краями – генератор кнопок – https://buttons.cm/
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<!--[if mso]> <v:roundrect xmlns:v="urn:schemas-Microsoft-com:vml" xmlns:w="urn:schemas-Microsoft-com:office:Word" href="http://www.EXAMPLE.com/" style="mso-wrap-style:none; mso-position-horizontal: center;" arcsize="10%" strokecolor="#d34a44" strokeweight="1px" fillcolor="#d34a44"> <v:textbox style="mso-fit-shape-to-text:true"> <center style="height:62px; padding: 21px 44px; width: 241px; color:#ffffff;font-family: 'Helvetica Neue',arial;font-size:16px;font-weight:bold;">оформить заказ</center> </v:textbox> </v:roundrect> <![endif]--> <![if !mso]> <table class="button radius btn" style="Margin: 0 0 0 0; border-collapse: collapse; border-spacing: 0; margin: 0 0 0px; padding: 0; text-align: left; text-transform: uppercase; vertical-align: top; width: auto ;"> <tbody><tr style="padding: 0; text-align: left; vertical-align: top;"> <td style="-moz-hyphens: auto; -webkit-hyphens: auto; Margin: 0; border-collapse: collapse ; color: #182023; font-family: 'Helvetica Neue',arial; font-size: 16px; font-weight: 400; hyphens: auto; line-height: 28px; margin: 0; padding: 0; text-align: left; vertical-align: top; word-wrap: break-word;"> <table style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top; width: 100%;"> <tbody><tr style="padding: 0; text-align: left; vertical-align: top;"> <td style="-moz-hyphens: auto; border-radius: 6px; background: #d34a44; -webkit-hyphens: auto; Margin: 0; background: 0 0; border: 0; border-collapse: collapse !important; color: #ffffff; font-family: 'Helvetica Neue',arial; font-size: 16px; font-weight: 400; hyphens: auto; line-height: 28px; margin: 0; padding: 0; text-align: left; vertical-align: top; word-wrap: break-word;"><a href="https://lbmarket.ru/" style="Margin: 0; background: #d34a44; border: 0 solid #d34a44; border-radius: 6px; color: #ffffff; display: block; font-family: 'Helvetica Neue',arial; font-size: 16px; font-weight: 700; line-height: 1.3; margin: 0; padding: 21px 44px; text-align: center; text-transform: uppercase; text-decoration: none;">оформить заказ</a> </td> </tr> </tbody></table> </td> </tr> </tbody></table> <![endif]> |
Скрыть контент
|
1 2 3 4 |
<!--[if mso]> <![endif]--><!--[if !mso]> <!--> <img src="https://site.com/upload/letters/dye/water-bg.png" alt="bg" width="234" height="148" style="-ms-interpolation-mode: bicubic; clear: both; display: block; max-width: 100%; outline: none; text-decoration: none; width: auto;"> <!-- <![endif]--> |
