Images Stretching in Outlook 2000

I just encountered an unexpected issue with Outlook 2000 that's causing every image in my email to stretch vertically.  I'm using litmus to test compatibility, and everything looks fine an every other client, including Outlook 2002 XP.   This is - also - the first campaign I've set up using HTML boilerplate. 

Here's the messed up stretched image in Outlook 2000:
http://i.imgur.com/5HJlC.png

Here's the correct image in Outlook 2002:
http://i.imgur.com/WiYeA.png

Here's the relevant code, before inlining:

<body>
<table border="0" align="center" cellpadding="0" cellspacing="0" id="backgroundTable">
    <tr>
        <td bgcolor="#d1d3d5">
            <table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
                <tr>
                    <td colspan="4" bgcolor="#FFFFFF" height="123"><img src="images/NALMCO_header.png" width="600" height="123" alt="NALMCO">
                    </td>
                </tr>
                <tr>
                    <td width="50" bgcolor="#19457C">&nbsp;</td>
                    <td colspan="2" bgcolor="#19457C">
                        <h1>New Business Development Tools from NALMCO<sup style="font-size: 12px;">&reg;</sup></h1>
                    </td>
                    <td width="50" bgcolor="#19457C">&nbsp;</td>
                </tr>
                <tr>

And here's the relevant code after Campaignmonitor inlines my CSS:

<body style="width:100% !important;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;margin-top:0;margin-bottom:0;margin-right:0;margin-left:0;padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;font-family:Arial, sans-serif;background-color:#d1d3d5;" >
<table border="0" align="center" cellpadding="0" cellspacing="0" id="backgroundTable" style="height:100% !important;margin-top:0;margin-bottom:0;margin-right:0;margin-left:0;padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;width:100% !important;" >
    <tr>
        <td bgcolor="#d1d3d5" style="border-collapse:collapse;" >
        
            <table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
                <tr>
                    <td colspan="4" bgcolor="#FFFFFF" height="123" style="border-collapse:collapse;" ><img src="https://i2.createsend1.com/ei/y/1F/64E/4CC/031854/images/nalmco_header.png" width="600" height="123" alt="NALMCO" style="height:auto;line-height:100%;outline-style:none;text-decoration:none;border-style:none;display:block;" >
                    </td>
                </tr>
                <tr>
                    <td width="50" bgcolor="#19457C" style="border-collapse:collapse;" >&nbsp;</td>
                    <td colspan="2" bgcolor="#19457C" style="border-collapse:collapse;" >
                        <h1 style="color:white !important;line-height:100% !important;font-size:28px;" >New Business Development Tools from NALMCO<sup style="font-size:12px;" >&reg;</sup></h1>
                    </td>
                    <td width="50" bgcolor="#19457C" style="border-collapse:collapse;" >&nbsp;</td>
                </tr>

Any helpful tips as to what's going on?

roshodgekiss roshodgekiss, 5 years ago

Hi atourgates, thanks for posting in the forum! In the code that's been inlined, I noticed the following two styles have been applied to the header image: height:auto; line-height:100%;

Is there any reason why these have been applied to the image? My recommendation would be to remove them and see if that solves the image-stretching issue. That in combination with the height:100% on the surrounding table (which you can also safely remove) may be the issue at hand. Good luck!


Get in touch with us on Twitter: http://twitter.com/campaignmonitor
We're also on Facebook: http://facebook.com/campaignmonitor
Cédric Cédric, 5 years ago

I had the same problem. I copy-pasted the css code from http://htmlemailboilerplate.com/.
Removed img{height:auto; line-height:100%;} and all is ok now

atourgates atourgates, 5 years ago

That's exactly it!  Thanks! 

After removing

img { height:auto; line-height: 100%

From the HTML Email boilerplate's style section, it renders perfectly in Outlook 2000. 

Thanks!

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098