Текст не выравнивается по вертикали в приложении Gmail для AndroidCSS

Разбираемся в CSS
Anonymous
Текст не выравнивается по вертикали в приложении Gmail для Android

Сообщение Anonymous »


В моем шаблоне электронного письма есть аватар, на котором отображается только первая буква текста на круглом фоне. Поскольку я не могу использовать JavaScript в шаблонах электронных писем, для этого я использую только CSS. Вот HTML-код, который я использую:

Джон Доу

Я получаю ожидаемый результат с помощью этого кода везде, где бы я ни тестировал, кроме приложения Gmail для Android. Вот скриншоты из приложения:

Изображение

Как видите, текст не выровнен по вертикали. Поскольку это происходит в приложении, а не в браузере, я не могу проверить элементы и устранить проблему.

В чем может быть причина неправильного выравнивания текста в приложении? И какое решение?

ОБНОВЛЕНИЕ 1

Пытался исправить это, избавившись от display: inline-block и vertical-align: middle и использовав display: table и < вместо этого code>display: table-cell. Не устранил проблему. в приложении Gmail он по-прежнему выглядит так же. Вот обновленный код:

Садман Ризван

ОБНОВЛЕНИЕ 2

Я обнаружил, что высота строки текста больше, чем высота родительского div, и поэтому текст не выровнен по вертикали внутри родительского div. Но я не знаю, как это возможно, поскольку для обоих я установил 36 пикселей. Я также не знаю, становится ли родительский div меньше или высота строки увеличивается в приложении Gmail. Есть ли способ это выяснить?

Вернуться в «CSS»