Почему при масштабировании страницы содержимое не приближается/отдаляется?
При вёрстке страницы сразу уделила внимание адаптивности, хотя пока есть только хэдер. Изучив данный вопрос, приняла решение все единицы измерения заменить на относительные- rem. Также, указала в html и body font-size:1vw; - это действительно помогло. Прописала медиа-запросы и когда захожу в devtools всё красивенько адаптируется и никуда не съезжает. Однако, заметила такую проблему, что когда масштабирую на десктопе страницу (Ctrl+Scroll), по сути должно всё работать как лупа: приближать или отдалять, но в моём же случае содержимое снова "адаптируется" и при zoom 25% страница выглядит ровно также как при zoom 100%, а при zoom 400% вообще срабатывает медиа-запрос и отображается "мобильная версия". Как исправить это понять не могу, сама только учусь.
1vw - это один % от ширины вьюпорта. при "зуме" эта ширина не изменяется, этот размер меняется только при том самом изменении ширины вьюпорта (окна или в режиме адаптивного дизайна того что изображает экран). Надо заменить на что-то более "относительное", например на rem.
Хорошо, я вообще убрала из html и body font-size:1vw; теперь при "отдалении" всё в порядке страница отдаляется в середину но при zoom 400% всё так-же отображается мобильная версия :(
anastasiavast, Объясню, изначально мне было нужно чтобы в devtools при изменении размеров экрана размер текста в хэдере пропорционально увеличивался или уменьшался. Нашла такой способ решения как html и body font-size:1vw, теперь же убрав эти строки размер текста в хэдере остается тем же.
Простой
