Резиновая вёрстка с помощью font-size: calc(100vw/1440*10)
Нашел на просторах интернета один из способов резиновой вёрстки.
Кто-нибудь может объяснить почему font-size: calc(100vw / 1440 * 10); применяется к каждому значению, будь то блок или шрифт? (Почему меняется ширина и высота блока которая задана через width и height, почему font-size влияет на изменение высоты и ширины блока) Как это работает?
Буду очень благодарен за помощь.
html {
font-size: calc(100vw / 1440 * 10);
}
div {
background-color: #000000;
width: 30rem;
height: 30rem;
color: #ffffff;
}<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Базовая разметка HTML</title>
</head>
<body>
<div>
<p>Адаптивный блок</p>
</div>
</body>
</html>