Почему текст «выравнивание по вертикали: средний» под окружающим текстом?

Как уже упоминалось, элементы имеют vertical-align по умолчанию baseline.

Что касается почему middle ниже baseline, MDN говорит следующее:

среднего

Выравнивает середину элемента с строчными буквами в родителя.

Поскольку высота текста шрифта больше, чем высота строчных букв, текст становится немного ниже.

2014-01-14 13:56:54 Zhihao

И поэтому единственный способ исправить мой пример - обернуть '1234' и' 890' в свои собственные теги '' с помощью 'vertical-align: middle'? (У '567' на самом деле есть другие стили, поэтому он все равно должен быть в своем размахе.) – Jesse

В вашем примере нет« исправления », так как он работает по назначению. Похоже, есть еще одна проблема, которую вы пытаетесь решить. Если у вас возникли проблемы с этим, лучше всего включить его в новый вопрос SO, поскольку это отдельная проблема. При этом использование одного и того же значения 'vertical-align' должно действительно выравнивать их по вертикали. – Zhihao

Обратите внимание, что это относится только к шрифтам, где descender достаточно мал. Представьте себе шрифт, в котором descender занимает больше половины высоты шрифта. Средняя точка строчной буквы будет еще выше, а средняя точка элемента обязательно будет ниже. Таким образом, текст элемента должен быть смещен выше, чтобы выровнять середину. – Alohci

Это потому, что текст имеет по умолчанию vertical-align: baseline. Ближний немного ниже базового.

источник

2014-01-14 13:53:06 knrz

Базовая линия - это линия, которая находится под дном букв, таких как n, a, b, а не q. – knrz

Почему текст «выравнивание по вертикали: средний» под окружающим текстом?

ответ

Смежные вопросы