0
Я делаю отзывчивый адрес электронной почты, где я могу перемещать изображения, если электронное письмо просматривается на мобильном устройстве. Все выглядит отлично, за исключением Outlook. Он отображает его в обоих местах. Я читал, что Outlook не распознает код «display: none». Есть ли что-нибудь еще, что можно сделать?Двойные изображения в Outlook по электронной почте
Вот что я хочу, чтобы мой код выглядел как и его работа над всем, кроме перспективы.
Медиа Запрос Код
@media only screen and (max-device-width: 479px) {
#mobile {display:block}
#desktop {display:none;mso-hide: all;}
}
@media only screen and (min-device-width: 480px) {
#mobile {display:none;mso-hide: all;}
#desktop {display:block}
}
}
А вот HTML я использую.
<table id="mobile" align="right" width="35%" cellpadding="0" cellspacing="0" border="0" class="deviceWidth">
<tr>
<td valign="top" align="right" class="hisrc">
<p style="mso-table-lspace:0;mso-table-rspace:0; margin:0; font-family:Helvetica, sans-serif; font-size:11px; color:323338; text-align:left; line-height:15px;">
<img src="vna-logo.png" alt="" border="0" style="padding-bottom:18px;border-radius: 4px; width: 220px;" class="deviceWidth" />
</td>
</tr>
</table>
<table id="desktop" align="right" width="35%" cellpadding="0" cellspacing="0" border="0" class="deviceWidth">
<tr>
<td valign="top" align="right" class="hisrc">
<p style="mso-table-lspace:0;mso-table-rspace:0; margin:0; font-family:Helvetica, sans-serif; font-size:11px; color:323338; text-align:left; line-height:15px;">
<img src="vna-logo-2.png" alt="" border="0" style="padding-bottom:18px;border-radius: 4px; width: 220px;" class="deviceWidth" />
</td>
</tr>
</table>