Community Forum

Over the years we have built up a community of email marketers, coders and designers that live and breathe email.

Use the Email on Acid Forum like your virtual water cooler: Stop by to discuss email code, quirky clients and fixes and post your issues (with an example of the code) for our community to offer its assistance.

 
   
Outlook <td> Border Style is Smaller than Other Email Clients

ajcoder

Newbie
Total Posts:  13
Posted: 11 June 2012 05:34 PM

When viewing the border in outlook, it looks great. When viewing in Hotmail and other email clients, the border is too wide. Do you have any idea how to make the borders the same size? If I make the border smaller width say 3px, then outlook makes it too small. I need to line up the border with the top and bottom image. Because this email will be longer, I need to be able to have the style border instead of an image to make the border.

Below are the images and the code. 

Image below is other email clients like gmail, hotmail - NOT outlook.
http://i50.tinypic.com/246v3h0.jpg

Image below is what it looks like in Outlook, specifically Outlook 07.
http://i48.tinypic.com/334nt00.jpg

<table  width="195" cellspacing="0" cellpadding="0" border="0" style="width:195px" >
                   <
tr>
        <
td valign="bottom">
            <
img src="http://i48.tinypic.com/mccjnp.jpg" alt="" width="195" style="display:block; padding:0;" /></td>
    </
tr>
    
    <
tr>
        <
td width="195" style="border-left: 6px solid #43b74c; border-right: 6px solid #43b74c; text-align:center; padding-bottom:12px; width:195px" bgcolor="#faf4af">
             
Placeholder Text
        
</td>
    </
tr>
    <
tr>
        <
td width="195" style="border-left: 6px solid #43b74c; border-right: 6px solid #43b74c; padding-bottom:6px; width:195px" bgcolor="#ffffff">
             
Placeholder Text
        
</td>
    </
tr>
    <
tr>
        <
td bgcolor="#ffffff" valign="top">
            <
img src="http://i50.tinypic.com/3u7ow.jpg" alt=""  style="display:block; padding:0;" /></td>
    </
tr>
    
           </
table

 

Michelle Klann

Avatar
Administrator
Total Posts:  204
Posted: 11 June 2012 06:04 PM
[ # 1 ]

Try adding the following to your embedded style sheet:

<style type="text/css">
  
table td {border-collapse:collapse;}   
</style

Let me know if that does the trick.

Cheers,
Miki


 

ajcoder

Newbie
Total Posts:  13
Posted: 12 June 2012 12:11 PM
[ # 2 ]

I tried that and it didn’t work. It looks like outlook’s pixels are smaller then the rest of email clients.

If I do 3 px, it looks like 1 px in outlook and normal in other email clients.