Yahoo Inconsistency

hello forum. i've coded an email blast for one of my clients and in all browsers and email clients it's viewing perfectly. for some reason, today, in Yahoo Mail an image in a split column table is showing up nudged over to the right. it works fine in my Yahoo account in safari and firefox, but for some reason my colleague is getting this result (see image in link)

http://likeletterprojects.com/clients/bv/eblast_v6/images/yahoograb.png

is there any way to fix this?

campaign link can be viewed here:
http://likeletterprojects.com/clients/bv/eblast_v6/eblastcm.html


<html>
<center>

<table id="header" width="600" height="40" border="0" cellpadding="0" cellspacing="0">
    <tr><td colspan="2"><div style="position:relative; height: 40; width: 600; font-family: Arial,Helvetica,Helveitca Neue,sans-serif; font-size: 10px; font-weight: 100; text-align: center; color: rgb(102, 102, 102);"> Having trouble viewing this email? <webversion>Please click here</webversion>.
    To ensure you receive future emails, <br>
please add <a href="mailto:ventfans@us.panasonic.com">ventfans@us.panasonic.com</a> to your address book.</div></td></tr></table>

<table id="topImage" width="600" height="170" border="0" cellpadding="0" cellspacing="0">
    <tr><td colspan="2"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_01.jpg" width="600" height="170" alt="Panasonic Vent Fan $10 Reward Card Offer"></td></tr></table>
           
<!-- 2 COLUMN SPLIT IMAGE -->
<table id="fieldGap" width="600" height="30" border="0" cellpadding="0" cellspacing="0">
           
    <tr >
    <td width="300"><div style="position:absolute; height: 30; width: 300; font-family: Arial,Helvetica,Helveitca Neue,sans-serif; font-size: 16px; letter-spacing:-.05em; font-weight: 600; padding-left: 34px; text-align: left; color: rgb(102, 102, 102);">Dear [Firstname1,fallback=Subscriber] [Lastname1,fallback=],</div></td>
        <td width="300"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_03.jpg" width="300" height="30" alt=""></td></tr></table>
   
<!-- END 2 COLUMN SPLIT IMAGE -->

<table id="imageLinks" width="600" height="630" border="0" cellpadding="0" cellspacing="0">   
    <tr><td colspan="2"><a href="http://www.panasonic.com/business/building-products/ventilation-systems/pdf/rebate/WhisperGreenRebate.pdf?cm_sp=Ventilation%20Fans-_-Left%20Column%20Ad-_-10%20Dollar%20Gift%20Certificate" target="_blank"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_04.jpg" alt="Please choose to display images to view this email properly." width="600" height="310" border="0"></a></td></tr>
    <tr><td colspan="2"><a href="http://www2.panasonic.com/webapp/wcs/stores/servlet/HowToBuyResults?storeId=15001&catalogId=13401&category=75112&mainCategory=75111&itemId=96743&modelNo=Ventilation&modelDesc=Fans" target="_blank"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_05.jpg" alt="" width="600" height="24" border="0"></a></td></tr>
    <tr><td colspan="2"><a href="http://panasonic.com/ventfans" target="_blank"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_06.jpg" alt="" width="600" height="21" border="0"></a></td></tr>
    <tr><td colspan="2"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_07.jpg" width="600" height="1" alt=""></td></tr>
    <tr><td colspan="2"><img src="http://likeletterprojects.com/clients/bv/eblast_v6/images/eblast_08.jpg" width="600" height="274" alt=""></td></tr>
    </table>


<table id="footer" width="600" height="40" border="0" cellpadding="0" cellspacing="0">
    <tr><td colspan="2"> <div style="position:relative; height: 40; width: 600; font-family: Arial,Helvetica,Helveitca Neue,sans-serif; font-size: 10px; font-weight: 100; text-align: left; color: rgb(102, 102, 102);"><br>
This message was sent to [email]by ventfans@us.panasonic.com.
<p<unsubscribe>Unsubscribe</unsubscribe> / <preferences>Manage</preferences>. <forwardtoafriend>Forward this email to a friend.</forwardtoafriend></p></div>
</td></tr></table>   


</center>
</html>

BThies BThies, 7 years ago

Two things:

First, before your unsubscribe you have an open <p.

Second, you're using some web coding in your design which is not compatible. 

Change this:

<div style="position:absolute; height: 30; width: 300; font-family: Arial,Helvetica,Helveitca Neue,sans-serif; font-size: 16px; letter-spacing:-.05em; font-weight: 600; padding-left: 34px; text-align: left; color: rgb(102, 102, 102);">Dear [Firstname1,fallback=Subscriber] [Lastname1,fallback=],</div>

To this:

<table align="right" width="280" cellpadding="0" cellspacing="0" border="0"><tr><td valign="bottom"><div align="left" style="font-family:Arial,Helvetica; font-size:16px; color:#666666;"><b>Dear [Firstname1,fallback=Subscriber] [Lastname1,fallback=],</b></div></td></tr></table>

Don't worry about the gaps that appear in previewing on the top and bottom of the image.  Once the first name and last name are filled in, it'll be the appropriate height.  If a long name comes along and ends up creating a second line, you'll need to shrink the font.


Brian Thies
Professional Email Developer
Thies Publishing
Dave Dave, 7 years ago

Great spotting Brian, some awesome contributions in the forum of late. Very cool to see.

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