Как заставить MS Outlook принимать отображение стиля CSS: блокировать?

Я составляю электронное письмо в формате HTML с помощью службы (MailChimp). Способ, которым MailChimp размечает заголовки, заключается в использовании тега SPAN и присвоении тегу встроенного стиля display:block.

MS Outlook 2010 игнорирует этот стиль. Я не могу найти работу вокруг. Таким образом, заголовки переносятся, нарушая желаемое отображение страницы.

Да, я знаю, что Outlook использует MS Word для отображения HTML.

Предположим, что я не могу вмешаться и отредактировать разметку вручную.

Как заставить MS Outlook принимать стиль CSS display:block и отображать тег SPAN в качестве элемента уровня блока?


css outlook outlook-2010
person mmcglynn    schedule 24.01.2012    source источник
comment
Вместо этого использовать тег div или p?   -  person Andres Ilich    schedule 24.01.2012
comment
У вас нет контроля над тем, как Outlook отображает стили HTML. Вам нужно исправить исходный код HTML, чтобы сделать его совместимым с Outlook.   -  person SliverNinja - MSFT    schedule 24.01.2012
comment
На что ты пытаешься это похоже? Outlook ничего не делает с атрибутом display, но его можно обойти с помощью таблиц.   -  person Dan Blows    schedule 24.01.2012
comment
Извините, только что увидел, что вы не можете изменить HTML. Это почему?   -  person Dan Blows    schedule 24.01.2012
comment
Бловски: я настраиваю шаблон для передачи пользователю MailChimp, поэтому лучше, чтобы он не редактировал HTML вручную.   -  person mmcglynn    schedule 24.01.2012

Ответы (3)


arrow_upward
26
arrow_downward

Атрибут CSS display не поддерживается в этой версии MS Outlook.

Вот «Книга» о том, что можно и что нельзя использовать:

campaignmonitor.com/css/

По сути, если вы не можете изменить свою разметку на нативно-блокируемый элемент, вы застряли.

person Diodeus - James MacFarlane    schedule 24.01.2012

arrow_upward
1
arrow_downward

К сожалению, лучше всего делать это по старинке. =[ Используйте таблицы вместо таблиц. поэтому таблицы = блоки.

person lenard-magentoinks    schedule 24.01.2012
comment
Я использую таблицы для структуры. Разметка исходит из редактора WYSIWYG, где таблицы недоступны. Опять же, предположим, что я не могу вмешаться и отредактировать разметку вручную. - person mmcglynn; 24.01.2012

arrow_upward
1
arrow_downward

Я оказался именно в такой ситуации: мне нужно было создать стили заголовков, которые правильно отображались бы в Outlook, без возможности редактировать HTML, потому что я передаю шаблон клиенту.

Я полагаю, вы уже решили эту проблему, но всем, кто потратил несколько часов, пытаясь ответить на этот вопрос, и наткнулся на эту тему, вот как я это исправил:

  1. Удалите H1, H2 и т. д. по умолчанию в Mailchimp.

  2. Создайте свои собственные стили заголовков (я назвал их «Заголовок», «Подзаголовок» и т. д., чтобы избежать путаницы).

  3. Используйте новые стили заголовков по своему усмотрению. Новые заголовки отображаются в виде блоков.

Я не совсем уверен, что происходит под капотом, поскольку я не могу проверить в Outlook, но я предполагаю, что, не используя стили по умолчанию, Mailchimp заключает текст заголовка в div вместо span.

person Noah Manger    schedule 06.01.2014
comment
Можете ли вы объяснить, как вы делаете шаг №. 2. Я знаю, как стилизовать тег в редакторе MC-кода, но не знаю, как добавить новый тег или как заменить один на другой. - person Maya Kathrine Andersen; 15.01.2014