Почему когда задаёшь стили 100vw и 100vh и overflow: hidder, всё равно элементы выходят за этот диапазон и появляется скролл?

Вероятно, проблема не связана с настройками 100vw и 100vh, а скорее с другими факторами, которые влияют на размеры и позиционирование элементов на странице.

1. Причина может быть в наличии отступов (margins) или границ (borders) у элементов. Некоторые элементы по умолчанию имеют отступы или границы, которые добавляются к их ширине и высоте. Если эти отступы или границы не учитываются при задании 100vw и 100vh, то элементы могут выйти за пределы заданного диапазона.

2. Еще одной возможной причиной может быть использование позиционирования элементов с помощью CSS свойства position. Если элементы имеют позиционирование, отличное от стандартного (static), то их местоположение может быть определено с помощью свойств top, right, bottom и left. Если значения этих свойств превышают размеры окна браузера, то элементы также могут выйти за заданный диапазон.

3. Еще одним возможным фактором может быть наличие других элементов, которые занимают место на странице. Если у вас есть другие элементы (например, футер или сайдбар), которые занимают место на странице, то это может привести к появлению скролла, даже если внутренний контент соответствует заданным размерам. В этом случае, чтобы элементы полностью помещались внутри заданного диапазона, вам может потребоваться отрегулировать размеры или позицию других элементов.

4. Наконец, скролл может быть вызван наличием содержимого, превышающего размеры окна браузера. Например, если у вас есть текст или изображения, которые занимают больше места, чем размер окна браузера, появится скролл. В этом случае, чтобы избежать появления скролла, вам придется создать оптимальную компоновку и размеры ваших элементов или использовать другие методы, такие как обрезка содержимого или использование масштабирования.

Поэтому, чтобы определить конкретную причину появления скролла в вашем случае, рекомендуется проверить указанные факторы и внести необходимые изменения в CSS стили, чтобы избежать выхода элементов за заданный диапазон.