html - Windows 10 Mail giving me large TD cells -
i writing email having issues in "windows 10 mail." have 3 table cell graphic in middle td. left & right tds contain 2-pixel height table gray background. make icon surrounded 2 gray lines.
the small tables have height=2
applied. i've tried using vml code, no effect. ideas?
results:
code below:
<table cellpadding="0" cellspacing="0" border="0" width="300" style="max-width: 300px"> <tr> <td valign="middle" width="35%" style="max-width: 108px; line-height: 0; font-size: 0"> <!-- left gray table --> <table cellpadding="0" cellspacing="0" border="0" width="100%" style="max-width: 108px; max-height: 2px" height="2"> <tr> <td height="2" bgcolor="#eaeaea" style="height: 2px; background-color: #eaeaea; font-size: 0; line-height: 0"><img src="http://go.rocketlawyer.com/rs/148-cgs-511/images/spacer.gif" height="2" width="100%" style="min-width: 74px; max-width: 108px; min-height: 2px; max-height: 2px; display: block"> </td> </tr> </table> <!-- end left gray table --> </td> <td align="center" valign="middle" width="53" class="full-width-image" height="92"><img src="http://go.rocketlawyer.com/rs/148-cgs-511/images/icon-quick-answers.png" alt="chat bubble icon" width="106" height="92" style="border-width:0;display:block;width:100%;max-width:53px;height:auto; max-height:92px"> </td> <td valign="middle" width="35%" style="max-width: 108px;"> <!-- right gray table --> <table cellpadding="0" cellspacing="0" border="0" width="100%" style="max-width: 108px; min-height: 2px; max-height: 2px" height="2"> <tr> <td height="2" bgcolor="#eaeaea" style="height: 2px; background-color: #eaeaea; font-size: 0; line-height: 0"><img src="http://go.rocketlawyer.com/rs/148-cgs-511/images/spacer.gif" height="2" width="100%" style="min-width: 74px; max-width: 108px; min-height: 2px; max-height: 2px; display: block"> </td> </tr> </table> <!-- end right gray table --> </td> </tr> </table>
for reason email client making height high columns. give method try see how goes.
<table cellpadding="0" cellspacing="0" border="0" width="300" style="max-width: 300px"> <tr> <td valign="middle" width="35%" style="max-width: 108px; "> <!-- left gray table --> <img src="https://i.stack.imgur.com/t24o6.png" height="2" width="100%" style="min-width: 74px; max-width: 108px; min-height: 2px; max-height: 2px; display: block"> <!-- end left gray table --> </td> <td align="center" valign="middle" width="53" class="full-width-image" height="92"><img src="http://go.rocketlawyer.com/rs/148-cgs-511/images/icon-quick-answers.png" alt="chat bubble icon" width="106" height="92" style="border-width:0;display:block;width:100%;max-width:53px;height:auto; max-height:92px"> </td> <td valign="middle" width="35%" style="max-width: 108px;"> <!-- right gray table --> <img src="https://i.stack.imgur.com/t24o6.png" height="2" width="100%" style="min-width: 74px; max-width: 108px; min-height: 2px; max-height: 2px; display: block"> <!-- end right gray table --> </td> </tr> </table>
tested in outlook well. have done added grey image 1px height.
hope after.
Comments
Post a Comment