web-dev-qa-db-ja.com

MS OutlookでCSSスタイルのdisplay:blockを受け入れるにはどうすればよいですか?

サービス(MailChimp)を使用してHTMLメールを作成しています。 MailChimpが見出しをマークアップする方法は、SPANタグを使用し、display:blockのインラインスタイルをタグに与えることです。

MS Outlook 2010はこのスタイルを無視します。回避策が見つかりません。したがって、見出しは折り返され、目的のページ表示が壊れます。

はい、OutlookはMS Wordを使用してHTMLを表示することを知っています。

マークアップに介入して手動で編集できないと仮定します。

MS OutlookでCSSスタイルdisplay:blockを受け入れ、SPANタグをブロックレベル要素として表示するにはどうすればよいですか?

21
mmcglynn

CSS display属性は、このバージョンのMS Outlookではサポートされていません。

使用できるものと使用できないものに関する「本」です。

campaignmonitor.com/css/

基本的に、マークアップをnatively-blockアイテムに変更できない場合、スタックします。

残念なことに、昔ながらのやり方でやることが一番です。 = [テーブルよりもテーブルを使用します。テーブル=ブロック。

1

テンプレートをクライアントに渡すため、HTMLを編集することなくOutlookで正しく表示されるヘッダースタイルを作成する必要があるという、まさにそのような状況に私は気づきました。

あなたはすでにこれを解決していると思いますが、この質問に答えようとして数時間を費やし、このスレッドを偶然見つけた他の人には、ここでそれを修正しました:

  1. MailchimpのデフォルトのH1、H2などを削除します。

  2. 独自のヘッダースタイルを作成します(混乱を避けるため、Header、Sub-Headerなどと命名しました)

  3. 必要に応じて、新しいヘッダースタイルを使用します。新しい見出しはブロックとして表示されます。

Outlookでは検査できないため、フードの下で何が起こっているのか正確にはわかりませんが、デフォルトのスタイルを使用しないと、Mailchimpはヘッダーテキストをスパンではなくdivでラップします。

1
Noah Manger