css float - Horizontal gap between floated tables in Outlook 2007/2010 -


i've spent 2 weeks find solution this, can't came across. if float tables after each, there 1 pixel gap in microsoft outlook 2007/2010, uses microsoft word 2007 html render engine:

enter image description here

i'd thank working solution – which not put tables in separated <td>'s.

here html code reproduce it:

<html>     <head>     <title>outlook 2007/2010 horizontal gap</title>     <meta http-equiv="content-type" content="text/html; charset=utf-8" />     <style type="text/css">         table { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }     </style> </head> <body bgcolor="#000000">     <table bgcolor="#ffff00" align="left"><tr><td>&nbsp;</td></tr></table>     <table bgcolor="#ffff00" align="left"><tr><td>&nbsp;</td></tr></table> </body> </html> 

what i've tried far:

  • display: inline-table; instead of align="left"
  • searched other relevant mso- css attributes no luck
  • removed whitespaces between <table> elements
  • border-collapse: collapse , border-spacing: 0
  • adding border: 1px solid red; remove gap increase width of tables
  • other display's, padding , margin
  • non related or deprecated html attributes (rules, frame, border, etc.) on <td> and/or <table>

fun factor:

if put these 2 tables table, gap's width increase 2 pixels.

here example of how float tables. need combination of border="1" , mso-table css in there rid of 1px gap. see example:

<table bgcolor="#454545" width="100%" border="0" cellpadding="0" cellspacing="0"><tr><td width="5%"></td><td align="center" width="95%">   <div align="left" style="float: left; padding: 0px; margin:0px;">   <table border="1" bordercolor="#959595" cellpadding="0" cellspacing="0" align="left" style="padding: 0px; margin:0px; mso-table-lspace: -1pt; mso-table-rspace: -1pt; ">     <tr>       <td width="318" bgcolor="959595">table 1        </td>     </tr>   </table> </div> <div align="left" style="float: left; padding: 0px; margin:0px;">   <table border="1" bordercolor="#959595" cellpadding="0" cellspacing="0" align="left" style="padding: 0px; margin:0px; mso-table-lspace:-1pt; mso-table-rspace: -1pt; ">     <tr>       <td width="318" bgcolor="959595">table 2        </td>     </tr>   </table> </div>   </td></tr></table> 

Comments

Popular posts from this blog

django - How can I change user group without delete record -

java - Need to add SOAP security token -

java - EclipseLink JPA Object is not a known entity type -