Marketo emails render incorrectly in different platforms

Anonymous · ‎09-25-2018

I need help fixing an emailing rendering problem that seems to be showing up in Outlook emails on PCs. I took the Marketo's "Carnival" template to build this email but broke from the template so I could adjust colors.

Below I list out the steps I took to troubleshoot the issue.

This is how the email should look. So far I can confirm it renders correctly in Outlook for Mac (2016) and Gmail:

However, here's how it shows on my colleagues Outlook 2016 (PC) using Windows 10:

To see if this issue originated from the Marketo template, I sent the same colleague a test email with just the original, unchanged Marketo template. It turns out that the template was in fact the problem.

In addition, I ran some tests using Inbox Inspector and GetResponse to test older email systems and was surprised to see that older versions of Outlook seemed to render better than the newest version.

To ensure my company's privacy, the below HTML does not include company info. If you find a solution for this issue, please let me know what parts were changed so I can apply them to the actual HTML email.

I truly appreciate any help that you can offer.

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--[if mso]>

.primary-font {

font-family:'verdana', geneva, sans-serif !important;

}

</style>

<![endif]-->

<!--[if mso]>

.secondary-font {

font-family:'verdana', geneva, sans-serif !important;

}

</style>

<![endif]-->

<!--[if mso]>

<![endif]-->

</head>

<tbody>

<tr>

<tbody>

<tr>

<tbody>

<tr>

<td class="module" style="mso-line-height-rule: exactly;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;word-break: break-word;background-image:http://go.fincad.com/rs/148-KHY-893/images/Email_bg.png;padding-left: 0;background-position: center center;background-size: cover;background-color:#e3e4e4;padding-top: 0;padding-right: 0;padding-bottom: 0;background-repeat:

no-repeat;background:http://go.fincad.com/rs/148-KHY-893/images/Email_bg.png;" valign="top" bgcolor="#e3e4e4" background="http://go.fincad.com/rs/148-KHY-893/images/Email_bg.png">

<!--[if gte mso 9]>

<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:660px;height:393px">

<v:fill type="frame" src="http://go.fincad.com/rs/148-KHY-893/images/Email_bg.png" color="#e3e4e4" />

<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">

<div>

<![endif]-->

<tbody>

</tr>

<tr>

<tbody>

Join our knowledge-exchange breakfast briefing:

</div>

Using Python to Solve Complex Modelling, Valuation and Risk Challenges

</div>

20 November, 2018

</div>

8:30-11:00 am

</div>

The Brewery (City of London)

<br />

</div>

</div> </td>

</tr>

</tr>

<tr>

<tbody>

<tr>

<td style="mso-line-height-rule: exactly;border-collapse: collapse;hyphens: none;-moz-hyphens: none;-webkit-hyphens: none;word-break: break-word;-moz-border-radius: 3px;background-clip: padding-box;-webkit-background-clip: padding-box;-moz-background-clip: padding;border-radius: 3px;-webkit-border-radius: 3px;" align="center" valign="middle" bgcolor="#41B6E6"><a class="primary-font button" href="http://go.fincad.com/20-november-python-fincad-briefing.html" target="_blank" style="font-size: 14px;font-family:'verdana', geneva, sans-serif;text-decoration: none;padding-top: 0.8em;padding-bottom: 0.8em;font-weight: 400;background-clip: padding-box;-webkit-background-clip: padding-box;-moz-background-clip: padding;border-radius:

3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;display: inline-block;border-top-style: solid;border-bottom-style: solid;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-bottom-color:#FFFFFF;border-left-color:#FFFFFF;border-right-style:

solid;color:#ffffff;border-left-width:1px;border-bottom-width:1px;border-right-width:1px;border-top-width:1px;padding-right: 20px;padding-left: 20px;border-left-style: solid;background-color:#41B6E6;">

<span>

Reserve Your Seat

</span></a></td>

</tr>

</tbody>

</table> </td>

</tr>

</tbody>

</table> </td>

</tr>

</tr>

</tbody>

</table>

<!--[if gte mso 9]></div>

</div>

</v:textbox>

</v:rect>

<![endif]-->

</center></td>

</tr>

</tbody>

</table>

<tbody>

<tr>

<tbody>

</tr>

<tr>

<tbody>

<tr>

<p><span style="font-size: 14px;">Join leading quantitative analysts and developers, technology leaders, traders, risk managers, portfolio managers and other finance professionals to exchange insights on how Python is being applied to valuation and risk models. </span></p>

<p><span style="font-size: 14px;"><span face="Verdana, sans-serif" style="font-family: Verdana, sans-serif;">Breakfast will be followed with roundtable discussions that explore the following questions:</span></span></p>

<ul>

<li><span style="font-size: 14px;">How is Python being used across your organization? (i.e. quantitative modelling, data integration)</span></li>

<li><span style="font-size: 14px;">What challenges or limitations has your team faced with implementing Python into data-intensive processes?</span></li>

<li><span style="font-size: 14px;">To what extent does your risk platform enable your quants to utilise Python into their risk frameworks?</span></li>

<li><span style="font-size: 14px;">What impact, if any, does Python have on overall revenue?</span></li>

</ul>

<div>

<span style="font-size: 14px;">More information about the Breakfast Briefing can be found <a href="http://go.fincad.com/20-november-python-fincad-briefing.html" target="_blank" id="" style="color: #41b6e6;">here</a>. We hope to see you on 20 November at the Brewery! </span>

</div>

</div></td>

</tr>

</tbody>

</table> </td>

</tr>

<tr>

</tr>

</tbody>

</table> </td>

</tr>

</tbody>

</table>

<tbody>

<tr>

<tbody>

</tr>

<tr>

<tbody>

<div>

<span style="font-family: verdana, geneva; font-size: 24px;">Reserve your seat<br /></span>

</div>

</div> </td>

</tr>

</tr>

<div>

<span style="font-size: 12px; line-height: 17px;">Due to space restrictions, we can only support a limited number of attendees. If interested, we encourage you to RSVP ASAP.</span>

<br />

</div>

</div> </td>

</tr>

</tbody>

</table>

<tbody>

</tr>

<tbody>

<tr>

<td style="mso-line-height-rule: exactly; border-collapse: collapse; hyphens: none; -moz-hyphens: none; -webkit-hyphens: none; word-break: break-word; -moz-border-radius: 3px; background-clip: padding-box; -webkit-background-clip: padding-box; -moz-background-clip: padding; border-radius: 3px; -webkit-border-radius: 3px;" align="right" bgcolor="#002855"><a class="primary-font button" href="http://go.fincad.com/20-november-python-fincad-briefing.html" target="_blank" style="-webkit-border-radius: 3px;font-family:'verdana', geneva, sans-serif;padding-top: 0.8em;padding-bottom: 0.8em;display: inline-block;text-decoration: none;-moz-border-radius: 3px;border-radius: 3px;-moz-background-clip: padding;-webkit-background-clip: padding-box;background-clip: padding-box;border-top-style:

solid;border-right-style: solid;border-bottom-style: solid;color: #ffffff;border-top-color:#FFFFFF;border-right-color:#FFFFFF;border-bottom-color:#FFFFFF;border-left-color:#FFFFFF;font-size: 19px;padding-left: 25px;padding-right:

25px;border-top-width:1px;border-right-width:1px;border-bottom-width:1px;border-left-width:1px;;border-left-style: solid;background-color:#002855;text-decoration-color:#ffffff;color:#ffffff;">

RSVP Now

</a></td>

</tr>

</tbody>

</table> </td>

</tr>

</tbody>

</table> </td>

</tr>

</tr>

</tbody>

</table> </td>

</tr>

</tbody>

</table>

<tbody>

<tr>

<tbody>

<tr>

<tbody>

</tbody>

</table> </td>

</tr>

</tbody>

</table> </td>

</tr>

</tbody>

</table></td>

</tr>

</tbody>

</table> </td>

</tr>

</tbody>

</table>

</html>

Josh_Hill13 · ‎09-26-2018

Github might be a better way to collaborate.

I suspect your issue is a typical outlook display error. There are some threads here on this and I'm sure around the internet.

Marketo emails render incorrectly in different platforms

Marketo emails render incorrectly in different platforms

Re: Marketo emails render incorrectly in different platforms