Почему неправильно наследуется line-height?

Поставил в em для body высоту линии - 1.5em. То есть 150% от текущего размера шрифта.

Создал внутри body блок, ему установил размер шрифта отличный от шрифта для body, но line-height почему-то остается независимым от заданного для блока размера шрифта:

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <style>
        body {
            font-size: 12px;
            line-height: 1.5em;
        }

        .block {
            font-size: 30px;
        }

    </style>
</head>
<body>

<div class="block">text here</div>

</body>
</html>


5cc7610c19083556377637.png

Что за дела? Если задаю в процентах - то же самое. Я хочу, чтобы при любом размере шрифта высота линии была 150% от него. em - это и есть величина зависящая от текущего размера шрифта
  • Вопрос задан
  • 239 просмотров
Решения вопроса 1
Lynn
@Lynn
nginx, js, css
Всё правильно наследуется, просто размер вычисляется в контексте элемента в котором задан line-height. Используйте просто число 1.5 и всё будет хорошо

https://developer.mozilla.org/en-US/docs/Web/CSS/l...
Prefer unitless numbers for line-height values
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы