Search code examples
html-email

Text is getting cut off in VML CTA on Outlook 2013 120DPI

I am using VML to make my bulletproof CTAs work in Outlook, they seem to be working fine everywhere except on Outlook 2013 120DPI where the text is cut off in the CTA: enter image description here

Everywhere else it works fine:

enter image description here

Here is the VML:

<!--[if mso]>
    <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://epredia.com/" style="height:34px;v-text-anchor:middle;width:176px;" arcsize="33.5px" strokecolor="#E5E5E6" fillcolor="#E5E5E6">
    <w:anchorlock/>
        <center style="color:#58595B;font-family:Helvetica, HelveticaArial, sans-serif, HelveticaNeueLTStd-Bd;font-size:18px;line-height:18px;">
            <b style='font-family:Helvetica, HelveticaArial, sans-serif, HelveticaNeueLTStd-Bd;'>
                Mini CTA
                                                    
            </b>
        /center>
    </v:roundrect>
<![endif]-->
Solution

  • You need to set the scaling.

    Have your HTML tag something like this (you might have different language or other attributes):

    <html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"  xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">

    And in your <head> add this:

    <!--[if gte mso 9]><xml>
  <o:OfficeDocumentSettings>
    <o:AllowPNG/>
    <o:PixelsPerInch>96</o:PixelsPerInch>
  </o:OfficeDocumentSettings>
</xml><![endif]-->