11

そのため、私は 1 週間中、会社のニュースレターの再設計に取り組んでおり、HTML を微調整して、すべての電子メール クライアントで半一貫して表示されるようにしました。私はこれの多くのために www.litmus.com をうまく利用しました。これは残っている最後のバグであり、私を逃れ続けています. 上部に水平なナビゲーション バーがあります。これは、 が1 つだけの簡素化されたバージョンで<td>、通常は 5 つです。

<table width="100%" border="0" align="right" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF" valign="middle">
    <tr valign="middle">
        <td valign="middle" align="center" style="font-family: 'Lucida Grande', Arial, sans-serif; font-size:12px; line-height: 200%; background-color:#b2382a; color: #FFFFFF; text-transform:uppercase;" >&nbsp;
            <a target="_blank" style="font-family: 'Lucida Grande', Arial, sans-serif; font-size:12px; line-height: 200%; background-color:#b2382a; color: #FFFFFF; text-transform:uppercase; text-decoration:none; vertical-align: middle;" href="LinkURLHere">
                <span style="color:#FFFFFF; vertical-align: middle;">Link Text Here</span>
            </a>&nbsp;
        </td>
    </tr>
</table>

ご覧のとおり、インライン スタイルは wazoo をアップします。Outlook 2002、2007、および 2013 を除くすべてのリトマス テストで問題なく表示されます。ただし、valign="middle" が無視され、リンク テキストが次のように上部にプッシュされます: http://i.imgur.com/a48ObB8 .jpg

valign="middle"ここと他の場所の両方のいくつかの情報源は、 valign が Outlook で機能することを示唆していますが、考えられるすべてのタグといくつかの css で属性を試しましたvertical-align: middle;。これはもはや真実ではありませんか?もしそうなら、何らかの回避策はありますか?

4

5 に答える 5

5

Valign は私にとっては常に機能しましたが、Outlook 2007 で機能するには <td> の高さを設定する必要があると思います。これは常に私のために働いた:

<table cellspacing="0" cellpadding="0" width="100%" border="0" align="right">
    <tr>
        <td align="center" valign="middle" bgcolor="#b2382a" height="35">
            <span style="color:#FFFFFF; 
                         font-family: 'Lucida Grande', Arial, sans-serif;
                         font-size:12px;
                         text-transform:uppercase;">
                Link Text Here
            </span>
        </td>
    </tr>
</table>
于 2013-09-20T13:22:28.220 に答える
2

簡単な答え: padding-top と padding-bottom を負の値で使用します。

長い答え: 相互互換性のあるメールを書きたい場合は、valign をまったく使用しないでください。デフォルトでは、テキストはセルの垂直方向の中央に表示される必要があるため、問題は別の場所に起因しています。

コードをデフォルトの中央に戻し、別のものが必要な場合は、ネストされたテーブル、セルパディング、マージン、およびパディングを使用して、探している配置を取得します。

于 2014-01-07T08:20:00.387 に答える
1

これはalign="right"、最初のテーブルのセットのためです。これを削除すると、問題が解決するはずです。他のオプションは、最初の の前に手動で間隔を追加すること<tr>です。

<tr><td height="30>&nbsp;</td></tr>
于 2019-10-09T06:31:14.557 に答える