html for email :: IE image / table display issue

corner box doesnt line up

[sneaks]

this is a ie 6 and 7 display issue
i am working on an email, doc type html 4 transitional... the email works fine in all email/webmail clients (yep even lotus notes), and most browsers (there is a link to click if it doesnt display properly which takes you to a web page) hwoever for some reason there is a display issue in ie6 and 7.

the problem is there are boxes with round corners and their left and right rails are not lining up when viewed as a webpage. they are totally fine in the outlooks.

i am not using colspans or anything complicated... just nested tables, images and text with barely any styles.heres a snippet of code of a few rows:

 <!-- roundedbox top ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
 <tr>
 <td width="571" align="left" valign="top"><img src="http://myclient.com/images/top_inthisissue.gif" width="571" height="18" alt="" /></td>
 </tr>
 <!-- rounded box content ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
 <tr>
 <td>
  <table cellspacing="0" cellpadding="0" border="0" width="571">
  <tr>
  <td width="10" align="left" valign="top"><img src="http://myclient.com/images/rail_left.gif" width="10" height="20" alt="" /></td>
  <td width="10" align="left" valign="top"><img src="http://myclient.com/images/spacer.gif" width="10" height="10" alt="" border="0" /></td>
  <td width="531" align="left" valign="top"><strong style="font-size:15px;font-family:Arial, Verdana, Sans-Serif; color:#FC0000;letter-spacing:2px;">In this Issue</strong></td>
  <td width="10" align="left" valign="top"><img src="http://myclient.com/images/spacer.gif" width="10" height="10" alt="" border="0" /></td>
  <td width="10" align="left" valign="top"><img src="http://myclient.com/images/rail_right.gif" width="10" height="20" alt="" /></td>
  </tr>
  </table>
 </td>
 </tr>
 <tr>
 <td>
  <table cellspacing="0" cellpadding="0" border="0" width="571">
  <tr>
  <td width="10" align="left" valign="top"><img src="http://myclient.com/images/left_inthisissue.gif" width="10" height="20" alt="" /></td>
  <td width="551" align="left" valign="top"><img src="http://myclient.com/images/separator_inthisissue_title.gif" width="551" height="1" alt="" /></td>
  <td width="10" align="left" valign="top"><img src="http://myclient.com/images/right_inthisissue.gif" width="10" height="20" alt="" /></td>
  </tr>
  </table>
 </td>
 </tr>

any help would be appreciated...

snx

[Marshall]

Try setting you <td> width to zero.

Marshall

[edited by: Marshall at 3:32 pm (utc) on July 4, 2007]

[sneaks]

didnt work... i have been playing with a strict doc-type and different inline styles but same thing..

appreciate the idea though!

:)
jd