CODEWITHSUNDEEP
htmlemailoutlook
egr103
egr103

Reputation: 3978

HTML Email looks fine in Litmus but broken in Outlook 2010

I have a table that when tested using Litmus, displays perfectly fine and displays like this for Outlook 2010 (logos blurred for obvious reasons):

enter image description here

However, when actually sent to the inbox of a Outlook 2010 user, Outlook bastardises it:

enter image description here

The code for this table is but I have no idea why this issue is happening or how to troubleshoot it, anyone got any ideas?:

<tr>

    <td width="610" valign="top" align="center">

        <table width="610" cellpadding="0" cellspacing="0" border="0" align="center" style="border-collapse:collapse; background: #000000; mso-table-lspace:0pt; mso-table-rspace:0pt; ">
            <tbody>
                <tr>
                    <td colspan="19"><img src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="5" height="15"></td>
                </tr>
                <tr>
                    <td width="22">&nbsp;</td>
                    <td width="52"><a href="#"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="#" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954400_gs.gif" width="52" height="54"></a></td>
                    <td width="26"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="26" height="1"></td>
                    <td width="70"><a href="#"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="#" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954399_g.gif" width="70" height="56"></a></td>
                    <td width="26"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="26" height="1"></td>
                    <td width="52"><a href="#"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="#" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/4593170_gear.gif" width="52" height="53"></a></td>
                    <td width="20"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="20" height="1"></td>
                    <td valign="bottom" width="31"><a href="#"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="Facebook" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/4019231_iconfacebook.gif" width="31" height="31"></a></td>
                    <td width="7"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="7" height="1"></td>
                    <td valign="bottom" width="31"><a href="https://twitter.com"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="Twitter" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/4019234_icontwitter.gif" width="31" height="31"></a></td>
                    <td width="7"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="7" height="1"></td>
                    <td valign="bottom" width="31"><a href="http://www.pinterest.com/"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="Pintrest" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/4019233_iconpintrest.gif" width="31" height="31"></a></td>
                    <td width="7"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="7" height="1"></td>
                    <td valign="bottom" width="31"><a href="http://www.lhw.com/"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="Google+" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/4019232_icongoogle.gif" width="31" height="31"></a></td>
                    <td width="7"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="7" height="1"></td>
                    <td valign="bottom" width="31"><a href="#"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="Youtube" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/4019235_iconyoutube.gif" width="31" height="31"></a></td>
                    <td width="30"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="30" height="1"></td>
                    <td valign="bottom" width="96"><a href="http://www.lhw.com/" target="_blank"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" alt="Leading Hotels" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954401_leadinghotels.gif" width="96" height="28"> </a></td>
                    <td width="22">&nbsp;</td>
                </tr>
                <tr>
                    <td colspan="19"><img style="display:block; border: none; text-decoration:none; -ms-interpolation-mode: bicubic;" src="http://i.emlfiles8.com/cmpimg/2/0/4/5/2/files/3954402_spacer.gif" width="1" height="15"></td>
                </tr>
            </tbody>
        </table>

    </td>

</tr>
<tr>
    <td height="50">&nbsp;</td>
</tr>
<tr>
    <td width="610" valign="top" align="center">
        <table cellpadding="0" cellspacing="0" border="0" align="center" style="border-collapse:collapse; background: #ffffff; mso-table-lspace:0pt; mso-table-rspace:0pt; ">
            <tbody>
                <tr>
                    <td style="LINE-HEIGHT: 15px; FONT-FAMILY: arial; COLOR: #000000; FONT-SIZE: 11px">This email was delivered to you  <br>
                    Click here to visit <a href="#">The </a>website. <br>
                    <br>
                    <b>Unsubscribe</b>: If you would prefer not to be contacted by #, please <a href="http://$UNSUB$">unsubscribe here. </a><br>
                    <b>Forward to a friend</b>: If you would like to forward this email to a friend, please <a href="http://$FORWARD$">click here. </a><br>
                    <a href="http://www.#.com/privacy-cookie-notice">Our Privacy Statement.</a> <br>
                    <br>
                    &copy; Copyright # 2014. <br>
                    sdfsdff lorem ipsum. <br>
                    sdfsdff lorem ipsumsdfsdff lorem ipsumsdfsdff lorem ipsumsdfsdff lorem ipsum sdfsdff lorem ipsum. </td>
                </tr>
            </tbody>
        </table>
    </td>
</tr>
<tr>
    <td height="50">&nbsp;</td>
</tr>

Upvotes: 0

Views: 169

Answers (1)

Swapnil
Swapnil

Reputation: 301

Please check if you have used any css into mail body

Upvotes: 2

Related Questions