I'm trying to set the email body with a generated HTML email template using body.setAsync(body, {coercionType: 'html'}). There are noticeable differences between what is rendered in the Outlook desktop clients Mac, 2016, 2019) and in OWA.
Is there any guidance around providing a consistent experience across different clients. Are there any html elements that known to cause issues rendering in Outlook desktop clients?
Ex: Email template
<div>BEFORE HTML TAG</div>
<html style="overflow-y: hidden;">
<div>before head element</div>
<head>
<title>Title here inside head</title>
</head>
<div>after head element</div>
<body style="height: auto; min-height: auto;">OUTLOOK LIGHT IN BODY
<br />
<br />
Test Email with Subject formula
</body>
</html>
<tr>
<td>OUTLOOK LIGHT Footer
<br />
<br />
Test Email with Subject formula
<br />
<br />
</td>
</tr>
OWA Email Body:
BEFORE HTML TAG
before head element
after head element
OUTLOOK LIGHT IN BODY
Test Email with Subject formula OUTLOOK LIGHT Footer
Test Email with Subject formula
Outlook for Mac Email Body:
OUTLOOK LIGHT IN BODY
Test Email with Subject formula
Outlook for Mac HTML using body.getAsync('html')
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<meta name=Generator content="Microsoft Word 15 (filtered)">
<style>
<!--
/* Font Definitions */
@font-face
{font-family:"Cambria Math";
panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
{font-family:Calibri;
panose-1:2 15 5 2 2 2 4 3 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
{margin:0in;
margin-bottom:.0001pt;
font-size:12.0pt;
font-family:"Calibri",sans-serif;}
.MsoChpDefault
{font-family:"Calibri",sans-serif;}
@page WordSection1
{size:8.5in 11.0in;
margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
{page:WordSection1;}
-->
</style>
</head>
<body lang=EN-US>
<div class=WordSection1>
<p class=MsoNormal>OUTLOOK LIGHT IN BODY<br>
<br>
Test Email with Subject formula</p>
<p class=MsoNormal> </p>
</div>
</body>
</html>
There is a disparity between what is rendered within each client.
The rendering engine for messages is different between OWA and native clients. Mac, Outlook 2016, and Outlook 2019 all use the same rendering engine, however they all have different versions as Microsoft has iterated on it. We do not guarantee that body.getAsync and body.setAsync are idempotent.. The clients will coerce the value passed to make it render as efficiently and with as much fidelity that is supported. Please add a request to our UserVoice for body APIs that provide more consistent support for HTML.