Как вы выражаете высоту div как кратное его высоте строки в чистом CSS без жесткого кодирования высоты строки или размера шрифта?
Фон
У меня есть поле (DIV), которое содержит текст состояния. Текст иногда будет охватывать несколько строк и часто нужен только один. Статус обновляется несколько (пять) раз в секунду, и это приводит к тому, что нижняя граница и все под окном "прыгают" вверх и вниз, когда поле меняет размер, чтобы соответствовать его содержимому.
Одним из решений прыжка было бы установить минимальную высоту DIV на высоту двух линий. Текст состояния с более чем двумя строками редок, поэтому допустимая степень прыжка будет приемлемой.
В качестве альтернативы я мог бы установить высоту на точную высоту двух строк и использовать переполнение: скрыть, чтобы обрезать текст. Это устранит все прыжки за счет некоторой информации.
Что вызывает вопрос: как выразить высоту как кратную высоте строки? Текст состояния наследует его внешний вид из глобальной таблицы стилей и не знает размер шрифта, семейство, высоту строки или что-то еще.
Half-решение
Я могу использовать элемент em, чтобы выразить высоту, ничего не зная о шрифте, но который все еще оставляет свойство высоты строки, которое также влияет на конечную высоту строки.
В идеале я бы предпочел наследовать высоту строки, но если я переопределю ее на известный множитель, то я могу заставить окно стать ровно на две строки.
.progressStatus
{
line-height: 1.1;
height: 2.2em;
}
Это решение достаточно хорошо для моих нужд, но мне любопытно, есть ли лучшее решение, которое не включает javascript.
