Как адаптировать размер текста при масштабировании страницы?

Question

[arthur_sites]

Учусь верстке. При увеличении масштаба страницы текст в div выходит за границы блока. Подскажите, как решить проблему.

Answer 1

[Максим Тимофеев]

Можно например использовать vh, задавая и высоту блока и размеры шрифта в vh - можно получить желаемый результат, но все завит от проекта.
Обычно делаю так:
для body и html задаем font-size:2vh;
далее используем rem
добавляем пару медиазапросов и меняем font-size для body и html, например для устройств где высота, больше ширины и т.д. Тогда все резиновое. Для всех блоков тоже можно высоту в rem указывать.

Answer 2

[Денис Инешин]

Запретить выходить за пределы блока:

.block {
    overflow: hidden;
}

Или например ломать слова:

.block {
    word-break: break-all;
}

Answer 3

[Александр Ружевич]

изменяйте шрифт медиа запросами в css, ну или js через resize например, но это муторно