web-dev-qa-db-ja.com

GmailはインラインCSS(メールテンプレート)として「position:relative」を削除します

私が理解していることから、Gmailは頭の中でCSSブロックをまったく受け入れません。そのため、メールテンプレートにインラインCSSを追加して機能させています。

しかし、私はCSSの配置プロパティに苦労しています。画像を背景画像の上に配置したいので、両方の親divをposition: relativeに設定し、画像を絶対に設定します。ただし、何らかの理由で、Gmailはposition:relativeを宣言するstyle属性をdivから削除します。ただし、他のすべてのインラインCSSは保持されます。

何か案が?回避策はありますか?

14
Charles Ingalls

悲しいことに、電子メール用に設計するときは、divと配置に関する完全に合理的なアイデアを放棄しなければならないのではないかと思います。電子メールクライアントでのCSSサポートは、絡み合った悪夢です。

電子メールのレイアウトを強制する唯一の(比較的)確実な方法は、古い学校のテーブルレイアウトを使用することです。これは残念ですが、避けられません。

キャンペーンモニターには、電子メールクライアントのCSSサポートの優れた要約があります ここ

28
Sinister Beard

メールマガジンを送信するときに、同様のレイアウトの問題が発生しました。解決策は、テーブルを使用して物事を適切に配置することでした。時代遅れですが、物事を思い通りに見せるための唯一の方法だったと思います。

4
Todd J.