Thanks Tatiana, but I am saying on the actual phones. I do see that the litmus tests do that.
But a few phones in the office seem to do it as well. Thanks for your thoughts.
Thanks Jaina, but this is on the actual mobile devices. It seems to happen sometimes and not other times, even though the emails are the same size. And it does happen on other devices, like iPhone 6, and Android.
Started a new discussion: Outlook iOS (iOS 11.0) MOBILE not showing entire email
Started a new discussion: show / hide Code does not work in Outlook 2016
I have been trying the show / hide and can not get it to work with color blocks. It keeps showing a white gap. Any suggestions.????
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SUNOVION Utibron Clinical Impressions</title>
<!--Utibron Ci Email_1 v1i-->
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;" />
<style type="text/css">
body {
background-color: #ffffff;
margin: 0px auto !important;
padding: 0px;
width: 100%; }
html {
width: 100%; }
.contentbg { background-color: #ffffff; }
img {
border:0px;
outline:none;
text-decoration:none;
display:block; }
.image_1 {
width: 100%; }
table.customers {
border-collapse: collapse;
border-spacing: 0;
width: 100%; }
span.preheader3{display: none; font-size: 1px;}
a{text-decoration:none;} /* to remove underlines in Windows Mail */
/* Clickable phone numbers - BE SURE TO CHANGE COLOR TO SAME FONT COLOR IN FILE /
a[href^="tel"], a[href^="sms"] {text-decoration:none; color:#000000; pointer-events:none; cursor:default;}
.mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {text-decoration:default; color:#000000 !important; pointer-events:auto; cursor:default;}
/ End of Clickable phone numbers */
*[class~=hide_on_desktop] { display: none !important;}
@media only screen and (max-width:640px)
{
body{width:auto!important;}
table[class=main]{width:446px !important;}
table[class=logo]{width:100% !important;}
table[class=righttop-details]{width:100% !important;}
table[class=social-top]{width:100% !important;}
td[class=viewonline-field]{padding: 10px 0px 0px 0px !important;}
td[id=viewonline]{text-align:center !important;}
td[class=productspace]{display:none !important;}
td[class=productbox]{width:100% !important; display:block;}
td[class=product-hidebox]{height:40px !important; display:block !important;}
td[class=subcontentbox]{width:100% !important; display:block;}
td[class=subcontent-space]{height:20px !important;}
td[class=bottomicon]{width:127px !important;}
table[class=bottomiconbox]{width:100% !important;}
td[class=bottomiconhidebox]{height:6px !important; display:block !important;}
table[class=icon-bottom]{width:100% !important;}
td[class=hidebox]{height:15px !important; display:block !important;}
td[class=hidebox-footer]{height:10px !important; display:block !important;}
td[class=footerbox]{width:100% !important; display:block !important;}
*[class~=hide_on_mobile] { display: none !important;}
*[class~=show_on_mobile] {
display : block !important;
width : auto !important;
max-height: inherit !important;
overflow : visible !important;
float : none !important;
}
@media only screen and (max-width:450px)
{
body{width:auto!important;}
table[class=main]{width:320px !important;}
table[class=logo]{width:100% !important;}
table[class=righttop-details]{width:100% !important;}
table[class=social-top]{width:100% !important;}
td[class=viewonline-field]{padding: 10px 0px 0px 0px !important;}
td[id=viewonline]{text-align:center !important;}
td[class=productspace]{display:none !important;}
td[class=productbox]{width:100% !important; display:block;}
td[class=product-hidebox]{height:40px !important; display:block !important;}
td[class=subcontentbox]{width:100% !important; display:block;}
td[class=subcontent-space]{height:20px !important;}
td[class=bottomicon]{width:127px !important;}
table[class=bottomiconbox]{width:266px !important;}
td[class=bottomiconhidebox]{height:6px !important; display:block !important;}
table[class=icon-bottom]{width:100% !important;}
td[class=hidebox]{height:15px !important; display:block !important;}
td[class=hidebox-footer]{height:10px !important; display:block !important;}
td[class=footerbox]{width:100% !important; display:block !important;}
*[class~=hide_on_mobile] { display: none !important;}
*[class~=show_on_mobile] {
display : block !important;
width : auto !important;
max-height: inherit !important;
overflow : visible !important;
float : none !important;
}
@media only screen and (max-width: 480px){
.emailButton{
max-width:600px !important;
width:100% !important; }
.emailButton a{
display:block !important;
font-size:18px !important; }
td[class=moveinpx] { padding-left:45px !important; }
td[class=moveinpx2] { padding-left:35px !important; }
.endmatter{
max-width:600px !important;
width:100% !important; }
}
</style>
<!-- Internet Explorer fix -->
<!--[if IE]>
<style type="text/css">
@media only screen and (max-width:640px)
{
table[class=subimagebox]{width:100% !important; float:left;}
td[class=main-contentbox]{width:285px !important; float:left; padding-left:75px !important;}
td[class=contentbox]{width:386px !important; float:left; display:block; padding:0px 25px !important;}
table[class=subcontentbox]{width:386px !important; float:left;}
td[class=footerbox]{width:100% !important; float:left; display:block
td[class=productbox]{width:336px !important; float:left; display:block; padding:0px 50px !important;}
}
@media only screen and (max-width:450px)
{
table[class=subimagebox]{width:100% !important; float:left;}
td[class=main-contentbox]{width:285px !important; float:left; padding-left:12px !important;}
td[class=contentbox]{width:100% !important; float:left; display:block; padding:0px !important;}
table[class=subcontentbox]{width:100% !important; float:left;}
td[class=footerbox]{width:100% !important; float:left; display:block;}
td[class=productbox]{width:100% !important; float:left; display:block; padding:0px !important;}
}
</style>
<![endif]-->
<!-- / Internet Explorer fix -->
<!-- Outlook -->
<!--[if gte mso 9]>
<style type="text/css">
.righttop-details{width:250px !important;}
.icon-bottom{width:286px !important;}
.subimagebox{width:240px !important;}
</style>
<![endif]-->
<!--[if gte mso 10]>
<style type="text/css">
.righttop-details{width:250px !important;}
.icon-bottom{width:286px !important;}
.subimagebox{width:240px !important;}
</style>
<![endif]-->
<!--[if gte mso 15]>
<style type="text/css">
.righttop-details{width:250px !important;}
.icon-bottom{width:286px !important;}
.subimagebox{width:240px !important;}
</style>
<![endif]-->
<!--[if gte mso 16]>
<style type="text/css">
.righttop-details{width:250px !important;}
.icon-bottom{width:286px !important;}
.subimagebox{width:240px !important;}
*[class~=hide_on_mobile] { display: none !important;}
*[class~=show_on_mobile] {
display : none !important;
width : auto !important;
max-height: inherit !important;
overflow : visible !important;
float : none !important; font-size: 0;mso-hide:all;}
</style>
<![endif]-->
<!-- / Outlook -->
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="contentbg">
<tr>
<td align="center" style="padding:5px 0px 0px 0px;">
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#ffffff" class="main">
<tr>
<td width="5"></td>
<td width="590" valign="top" class="hide_on_mobile">
<img src="http://www.biopharmcommunications.com/deploy/Sunovion/Utibron/Ci/email1_neohaler_hero_small_utibron_ci_new.png" alt="LABA/LAMA Combination with Full Audiovisual Dose Feedback" class="image_1" />
</td>
<td width="5"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" style="padding:0px 0px 0px 0px; ">
<table width="360" border="0" align="center" cellpadding="0" cellspacing="0" class="main">
<tr>
<td width="5"></td>
<td width="350" class="show_on_mobile" style="padding:0px 0px 0px 0px; width: 0;
max-height: 0;
overflow: hidden;
float: left;
display: none;">
<img src="http://www.biopharmcommunications.com/deploy/Sunovion/Utibron/Ci/email1_neohaler_hero_small_mobile_utibron_ci_new.png" alt="image" class="image_1"/>
</td>
<td width="5"></td>
</tr>
</table>
</td>
</tr>
<tr><td align="center" valign="top">
<table width="590" bgcolor="#0D5480" border="0" align="center" cellpadding="0" cellspacing="0" class="main">
<tr>
<td width="5" > </td>
<td valign="top">
<table width="100%" border="0" align="right" cellpadding="0" cellspacing="0" class="main">
<tr>
<td align="center" valign="middle" style="padding:5px 5px 5px 5px;">
<span style="color:#ffffff; font-family:Arial, Verdana, Trebuchet MS, sans-serif; font-size:14px; font-weight:500; line-height:20px; padding:10px 0px 10px 0px;">
<a style="text-decoration:underline; color:#ffffff;" href="http://sunovion.clinicalimpressions.com/Ferguson"><b>View</b></a><b> a Clinical Perspective From Dr. Joans ►</b></span>
</td>
</tr>
</table>
</td>
<td width="5"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Started a new discussion: Outlook 2016 Corner Buttons - Using arcsize
Has anyone found a resolution to this mystery line?