Почему высота строки задана в пикселях, зависящих от размера шрифта родителя?

Question

Я сделал этот пример: http://codepen.io/tomsoderlund/pen/JYJpPR, чтобы продемонстрировать.

я устанавливаю font-size (= размер 1 эм) на родителя (.canvas) с использованием:

$('.canvas').css('font-size', emSize + 'px'); 

И font-size и line-height устанавливаются в пикс. font-size есть (правильно) не, на который распространяется размер родителя, но line-height - это почему?

Answer 1

высота линии относится только к блоку элементы уровня. Вы должны добавить отображение: блокировать свой диапазон.

На элементах уровня блока свойство line-height указывает минимальную высоту строк строки внутри элемента.

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

MDN line-height