Windows 10 Mailに大きなTDセルがあります

Question

「Windows 10 Mail」にのみ問題がある電子メールを書いています。私は真ん中のTDのグラフィックを持つ3テーブルセルを持っています。左の&右のTDには、灰色の背景を持つ2ピクセルの高さテーブルが含まれています。これは、アイコンが2つの灰色の線で囲まれているように見えるようにするためです。

小さなテーブルにはすべてheight=2が適用されています。 VMLコードを使用してみましたが効果はありません。何か案は？

結果：以下

コード：電子メールクライアントは、列には高すぎる高さを作っているいくつかの理由

<table cellpadding="0" cellspacing="0" border="0" width="300" style="max-width: 300px"> 
 
\t <tr> 
 
\t \t <td valign="middle" width="35%" style="max-width: 108px; line-height: 0; font-size: 0"> 
 
\t \t \t <!-- Left Gray Table --> 
 
    \t \t \t <table cellpadding="0" cellspacing="0" border="0" width="100%" style="max-width: 108px; max-height: 2px" height="2"> 
 
    \t \t \t \t <tr> 
 
    \t \t \t \t <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"> 
 
    \t \t \t \t </td> 
 
    \t \t \t \t </tr> 
 
\t \t \t </table> 
 
\t \t \t <!-- END Left Gray Table --> 
 
\t \t </td> 
 
\t \t <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"> 
 
\t \t </td> 
 
\t \t <td valign="middle" width="35%" style="max-width: 108px;"> 
 
\t \t \t <!-- RIGHT Gray Table --> 
 
\t \t \t <table cellpadding="0" cellspacing="0" border="0" width="100%" style="max-width: 108px; min-height: 2px; max-height: 2px" height="2"> 
 
\t \t \t \t <tr> 
 
\t \t \t \t \t <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"> 
 
\t \t \t \t \t </td> 
 
\t \t \t \t </tr> 
 
\t \t \t </table> 
 
\t \t \t <!-- END RIGHT Gray Table --> 
 
\t \t </td> 
 
\t </tr> 
 
</table>

Answer 1

。このメソッドに、それがどうなるか見てみましょう。同様にOutlookでテストさ

<table cellpadding="0" cellspacing="0" border="0" width="300" style="max-width: 300px"> 
 
\t <tr> 
 
\t \t <td valign="middle" width="35%" style="max-width: 108px; "> 
 
\t \t \t <!-- Left Gray Table --> 
 
    \t \t \t <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"> 
 
\t \t \t <!-- END Left Gray Table --> 
 
\t \t </td> 
 
\t \t <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"> 
 
\t \t </td> 
 
\t \t <td valign="middle" width="35%" style="max-width: 108px;"> 
 
\t \t \t <!-- RIGHT Gray Table --> 
 
\t \t \t <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"> 
 
\t \t \t <!-- END RIGHT Gray Table --> 
 
\t \t </td> 
 
\t </tr> 
 
</table>

。私がしたことは、1pxの高さの灰色の画像が追加されたことです。

これはあなたの後だったものです。