Getting rid of table borders in HTML emails

Question

I am working on an HTML email campaign (without CSS), so I have to use tables, which I am not very familiar with. Everything looks right for me. EXCLUDE table borders. Whenever I create a new <tr> , I can’t get rid of the inner border around the content for life. I tried a few tricks ( border="0px" , bordercolor="white" , bordercolor="#ffffff" , etc.), but whenever I send a test message, the borders still remain black around my text and images.

It really messes with my design stream. Is there a trick I don't know to get rid of the borders of an HTML table? Help!

Answer 1

If the content is an image, try <td valign="top"> for all <td> with images inside. In addition, the table tag should be <table cellpadding="0" cellspacing="0" ...> . Another tip, use the inline style for the borders you want.

Answer 2

Apply this:

 style = "border-collapse: collapse;" 

In each cell of the table, the border should no longer be displayed.

Answer 3

What about

 <table style="border-collapse: collapse;"> <!-- ... --> </table> 

? Such inline CSS should work fine even in HTML email.

Answer 4

To get rid of table borders, use <table border="0"> .

Answer 5

Try the following:

In the head:

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

Table:

 <table width="300" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" style="border:2px solid #000000;"> <tr> <td width="50%" bgcolor="#999999" style="padding:20px;"> ... </td> <td width="50%" bgcolor="#888888" style="padding:20px;"> ... </td> </tr> <tr> <td width="50%" bgcolor="#777777" style="padding:20px;"> ... </td> <td width="50%" bgcolor="#666666" style="padding:20px;"> ... </td> </tr> </table> 

Also, always keep cellpadding and cellspacing to zero. Use spaces in your cells if you want to spacing.

Answer 6

  <table border="0" cellpadding="0" cellspacing="0" width="100%" style = "border-collapse: collapse;"> 

Answer 7

Use <table border="0"> without px?

Answer 8

Just stumbled upon this tip that really works (at least for iOS):

To prevent the appearance of [hairline borders], nest the problem table into a new table with a background color that matches the inner table.

Source: http://www.informz.com/blog/template-design/quick-tip-removing-hairline-borders-in-html-emails-on-iphone-ipad/ (includes photos of the source code)