Outlook 2013 adding padding to images

Question

I'm having an issue with a section of an email on 2013. What should look like so (and is rendering as such in all platforms except Outlook 2013):

Shows up in Outlook 2013 like so:

(Please don't mind the FullMurray images.)

It seems like Outlook 2013 is adding extra padding around the images and is breaking the border effect. I've tried line-height: 1px and padding: 0px, on the Table, TD and IMG respectively and had no success. Does anyone have any ideas of how to fix? I will post my code for this section below.

<table class="" width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="padding: 0px;">
                            <tr>
                                <td align="left" valign="top" style="padding: 0px; border-bottom: 2px solid #F98234;" width="60px" >
                                    <img src="http://www.fillmurray.com/60/90" alt="" title="" style="height:90px;padding: 0px;" />
                                </td>
                                <td align="left" style="font-family: Verdana, Helvetica, Arial, sans-serif; mso-line-height-rule: exactly; line-height: 25px;padding-top:5px; padding-bottom:5px;padding-left:15px;padding-right:5px;border-top:1px solid #F98234; border-bottom:1px solid #F98234;border-left:1px solid #F98234" width="325px">
                                    <p style="margin:0px; color:#031359;font-weight:bold;text-transform:uppercase; font-size: 19px; ">Reward Points Balance<sup style="font-size: 12px; line-height:1.5px;">&dagger;</sup></p>
                                </td>
                                <td align="left" style="font-family: Verdana, Helvetica, Arial, sans-serif; mso-line-height-rule: exactly; line-height: 25px;padding-top:5px; padding-bottom:5px;padding-left:15px;padding-right:5px;border-top: 1px solid #F98234; border-bottom: 1px solid #F98234" width="30px">
                                    <hr width="1" size="50px" style="background-color:#D1D2D3; border:none">
                                </td>
                                <td align="left" style="font-family: Verdana, Helvetica, Arial, sans-serif; mso-line-height-rule: exactly; line-height: 25px;padding-top:5px; padding-bottom:5px;padding-left:5px;padding-right:15px;border-top:1px solid #F98234; border-bottom:1px solid #F98234;border-right:1px solid #F98234">
                                    <p style="margin:0px; color:#031359;font-weight:bold;text-transform:uppercase; font-size: 19px; ">5,000</p>
                                </td>
                            </tr>
                        </table>

Answer 1

I wouldn't use the padding style or p tags in any emails to keep compatibility across all platforms.

I use this guide as a compatibility reference:

https://www.campaignmonitor.com/css/

I would try creating 3 separate tables instead of 1 row in a single table.

Basically, you want to keep everything very simple with HTML for emails, stick to margins instead of padding, and br instead of p as a general rule.