The following button code is ALMOST bullet proof. I need help getting it all the way there.

  • On the “green button,” the <!--[if mso]--> code shows through in Lotus Notes 8.5 and Outlook 2000-2003.
  • I thought I fixed this problem in the “red button,” but discovered that the button disappears when I send and view in Outlook.com (Edge and Firefox) despite it showing up there beautifully in LITMUS.

This button code accomplishes a few things other code out there I’ve found doesn’t do: background color displays in Lotus Notes 8.5, corners are rounded in all email clients, and button does not duplicate when forwarded.

 <div>
<!--[if mso]>
  <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="#" style="height:40px;v-text-anchor:middle;width:270px;" arcsize="10%" stroke="f" fillcolor="#6bb094">
    <w:anchorlock/>
    <center style="color:#ffffff;font-family:sans-serif;font-size:15px;font-weight:bold;">
GREEN BUTTON
    </center>
  </v:roundrect>
  <![endif]-->
 <![if !mso]>
  <table cellspacing="0" cellpadding="0"> <tr> 
  <td align="center" width="270" height="40" bgcolor="#6bb094" style="-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; display: block;">
    <a href="#" style="font-size:15px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; display:inline-block">
    <span style="color: #ffffff;">
GREEN BUTTON</span>
    </a>
  </td> 
  </tr> </table> 
<![endif]-->
</div>

<hr>

<div>
<!--[if mso]>
  <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="#" style="height:40px;v-text-anchor:middle;width:270px;" arcsize="10%" stroke="f" fillcolor="#ef4036">
    <w:anchorlock/>
    <center style="color:#ffffff;font-family:sans-serif;font-size:15px;font-weight:bold;">
RED BUTTON
    </center>
  </v:roundrect>
  <![endif]-->
  <!--[if !mso]>-->
  <table cellspacing="0" cellpadding="0"> <tr> 
  <td align="center" width="270" height="40" bgcolor="#ef4036" style="-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; display: block;">
    <a href="#" style="font-size:15px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; display:inline-block">
    <span style="color: #ffffff;">
    RED BUTTON</span>
    </a>
  </td> 
  </tr> </table> 
  <!--<![endif]-->
</div>