Высота строки не наследуется в Outlook - PullRequest
Новая
       88

Высота строки не наследуется в Outlook

0 голосов
/ 20 апреля 2020

Только в Outlook, текст не наследует свойство line-height от любого родительского элемента, который вложен более чем в два элемента выше.

Например, высота строки применяется к ним: 

<div style="line-height:150%">
    Text
</div> 

<div style="line-height:150%">
    <td>
        Text
    </td>
</div>

(Изменить: хотя второй работает, неправильно помещать тд в div)

Но если стиль встроен в тело тег или родительский элемент вне непосредственного td текст находится в

Я пробовал комбинации следующих элементов:

  • С и без mso-line-height-rule: exactly; до и после стиля высоты строки
  • Значение высоты строки в процентах и ​​точках (150% и 1,5), я думаю, что только проценты работают в Outlook, но я все равно попробовал оба варианта (Редактировать: Спасибо за комментарий, объясняющий разницу между этими двумя! )
  • При размещении стиля на разных элементах (td, tr, table, body и т. Д. c), кажется, работает только div, как видно из примеров выше
  • Удаление свойство стиля margin из всех элементов (я объявление где-то, что поле может мешать стилям обработки Outlook, но без кубиков 150% высоты строки шаблона, поэтому нам не нужно изменять высоту строки для каждого блока, который создается отдельно.

    Знает ли кто-нибудь с гиперспецифическими c знаниями по разработке Outlook исправление или обходной путь? Или мне просто нужно применить высоту строки к отдельным текстовым блокам для размещения в Outlook?

    Редактировать:

    Я узнал, что с помощью div внутри таблицы является ошибкой, если он не находится внутри td

    Так что я думаю, что моя главная загадка - почему Outlook не отображает высоту строки в любом элементе, который НЕ является div. Еще одна загадка внешнего вида LOL

1 Ответ

0 голосов
/ 22 апреля 2020

Пока все просто, Outlook, кажется, сохраняет стилизацию в <head>.

Так что это работает во всех почтовых клиентах для бесконечной вложенности: 

<style type="text/css">
  td {
    line-height:150%;
  }
</style>
...