HTML電子メールのテーブルセルのOutlookの崩壊

Question

私はこの問題を抱えており、まだ解決策を見つけることができませんでした。 HTML電子メールでは、私はいくつかのOutlookプログラムでは、セルを崩壊することがわかった。両方とも2007/2010例：

<tr> 
    <td width="10"><img></td> 
    <td width="80">Copy</td> 
    <td width="10"><img></td> 
</tr> 

Outlookは、中央の列のセルの幅を無視します。また、幅にCSSを使用するかどうかは関係ありません。

<tr> 
    <td style="width:10px;"><img></td> 
    <td style="width:80px;">Copy</td> 
    <td style="width:10px;"><img></td> 
</tr> 

これは同じ結果です。

私が把握できなかったことは、このセルの幅の崩壊を引き起こすOutlookの設定です。そして、典型的には、それは当社のCEOのためにOutlookでのみ起こります。私はもはやこの方法でそれ以上のコピーを持つセルをコード化していません。しかし、私はそれがうまくいくと思っています。 OutlookのCEOのコンピュータではありません。

Outlookのどのような設定がこれを引き起こすのか誰かが知っていますか？私は私のコンピュータにこの設定をしたいと思うので、私はCEOにそれをテストする必要はありません。

Answer 1

1行だけでなく、テーブル全体でより広範なコード例を提供できますか？なぜこれが起こっているのかを手がかりにするのに役立ちます。

とにかく、Outlookで私に役立つものは、列幅を正確な高さに強制する表の一番上の行をテーブルに追加することです。その下に

<table> 
    <tr> 
    <td width="10" height="1"><img width="10" height="1" /></td> 
    <td width="80" height="1"><img width="80" height="1" /></td> 
    <td width="10" height="1"><img width="10" height="1" /></td> 
    </tr> 

、その後、行はその列幅に準拠：1x1の透明GIFは、表のセル幅に加えて、設定幅で、でも見通しが待機する「ブルートフォース」メソッドとして動作しているようです一番上の行

Answer 2

Windows版Outlook 2013でこの問題が発生していました。それはMac用のOutlook（そしてGmail、そしてほとんどすべての最新の電子メールクライアント）でうまくいきましたが、Windows用のOutlook 2013ではすべてが完全に崩壊してしまいました。

解決策は単純でした。ピクセル幅（インラインスタイルを除く）を宣言している場合は、pxには入れないでください。あなたは本当に古い学校でなければなりません。ここに私の最終的な（働く）コードがあった：

<table cellspacing="0" cellpadding="0" border="0"> 
    <tr> 

    <td width="1" align="left" valign="top" bgcolor="#ffffff"><img src="#"></td> 
    <td width="150" align="center" bgcolor="#ffffff"><span style="font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: lighter;"><a style="color: #5f6062; text-decoration: none;" href="#">SECTION 1</a></span></td> 

    <td width="150" align="center" bgcolor="#ffffff"><span style="font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: lighter;"><a style="color: #5f6062; text-decoration: none; text-decoration: none;" href="#">SECTION 2</a></span></td> 

    <td width="150" align="center" bgcolor="#ffffff"><span style="font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: lighter;"><a style="color: #5f6062; text-decoration: none;" href="#">SECTION 3</a></span></td> 

    <td width="149" align="center" bgcolor="#ffffff"><span style="font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: lighter;"><a style="color: #5f6062; text-decoration: none;" href="#">SECTION 4</a></span></td> 

    </tr> 
    </table>