一連のネストされたテーブルを使用して、テーブルベースのレスポンシブ メールを作成しています。私の一般的なレイアウトは次のようになります。
数字はhtmlでの流れを表しています。
現在、Outlooks '07 および '10 (Microsoft Word エンジンでレンダリングされたもの) では、ボックス 2 が特定の高さに達すると、ここ、ここ、およびここで提案されているように、ページ/改行が挿入されているように見えます。
これらのインスタンスで Outlook/Word によって実際に解釈されるため、コードを表示する方法がわからないため、表示されると言います。問題は、このブレークが入力されると、次の図のように、ボックス/テーブル 3 がブレークと同じになるように強制されることです。
今、私が見た多くの情報源が示唆しているように、それがそれ自体でそれを行う<tr style="page-break-before: always">直前に壊れるようにします.
上記の MailChimp の記事で提案されているように、<br/>要素をターゲットにする条件付きコードも実装しようとしました。
<!--[if gte mso 9]>
<style type="text/css">
br { display: none;} </style>
<![endif]-->
しかし、目立った違いは見られませんでした。レスポンシブで、モバイル メール クライアント用に次のように 1 つの列に折りたたまれるため、このレイアウトを使用しています。
これらの要素はすべて大きなテーブルにもネストされていますが、ドキュメント全体が長くなりすぎないようにテーブルを積み重ねて分割し、テーブル/ボックス 3 を複製して、テーブル/ボックスが3 は 2 列のレイアウトで表示され、2 番目にボックス/テーブル 1 のテーブルに保持されます。次に、1 列のモバイル表示の場合、複製は現在のテーブル/ボックス 2 の下に表示されるように設定されます。 、しかし、それは私のレイアウトを台無しにし、2つの場所に同じ更新を必要とします.
align:テーブルは現在、属性を使用して設定されています。
では、Outlook がテーブルを壊さないようにしたり、ドキュメントのアーキテクチャを変更せずに同じように表示したりする方法はありますか?