Search code examples
htmlemailoutlookgmailhtml-email

Outlook Emails I send look different in the app versus the browser. Mainly formatting and background color

Im sending an email with some basic formatting in it. It displays fine in Gmail, and outlook on the browser. But as soon as i open it up in either the Gmail app or outlook app it looks bad.

Here is the proper image: Proper looking from browser

Here is the bad version that shows in apps: bad looking in apps

Here is the HTML that is generated in browser for the pink bar for example of the proper looking version:

<td style="padding:20px" align="center" bgcolor="#facbe3">
   <a href="" style="font-size:16px;text-decoration:none;color:#222d64" target="_blank">
   <img src="" alt="Follow Us On Facebook" style="height:40px;width:40px;margin-left:10px" 
      class="CToWUd">
   </a>
   <a href="" style="font-size:16px;text-decoration:none;color:#222d64" target="_blank" >
   <img src="" alt="Follow Us On Instagram" style="height:40px;width:40px;margin-left:10px" 
      class="CToWUd">
   </a>
   <a href="" style="font-size:16px;text-decoration:none;color:#222d64" target="_blank">
   <img src="" alt="Follow Us On Pintrest" style="height:40px;width:40px;margin-left:10px" 
      class="CToWUd">
   </a>
   <a href="" style="font-size:16px;text-decoration:none;color:#222d64" target="_blank" >
   <img src="" alt="Visit Us On Youtube" style="height:40px;width:40px;margin-left:10px" 
      class="CToWUd">
   </a>
</td>

My MAIN concern is why the color is different. Any help as to why it would change would be really appreciated. Thanks guys and gals

Solution

  • A common email problem in general is that dark mode on browsers and phones can act weird and cause issues with background colors.