2

私はこの問題に遭遇しましたが、まだ解決策を見つけることができていません。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 以外はテストする必要はありません。

4

2 に答える 2

0

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

とにかく、Outlook でうまくいくのは、テーブルの一番上の行を追加して、列の幅を正確な高さに強制することです。表のセルの幅に加えて幅が設定された 1x1 の透過 GIF は、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>

その下の行は、その一番上の行の列幅に準拠します。

于 2011-06-17T20:39:21.793 に答える
0

Outlook 2013 for Windows でこの問題が発生していました。Outlook for Mac (および Gmail、その他のほとんどすべての最新の電子メール クライアント) では問題なく動作しましたが、Outlook 2013 for Windows ではすべてが完全に崩壊します。

解決策は簡単でした: ピクセル幅を宣言する場合は 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>
于 2015-03-17T22:31:45.073 に答える