Что делает мета-атрибут shrink-to-fit viewport?
У меня возникли проблемы с поиском документации для этого. Это специфика сафари?
была недавняя ошибка в iOS 9 (здесь), решение которого заключается в добавлении shrink-to-fit=no
для просмотра мета.
что делает этот код?
1 ответ:
Это Safari specific, по крайней мере на момент написания, вводится в Safari 9.0. Из раздела " Что нового в Safari?"документация для Safari 9.0:
Видовой Экран Меняется
метатеги видового экрана с помощью
"width=device-width"
заставьте страницу уменьшаться, чтобы соответствовать содержимому, которое выходит за пределы видового экрана. Вы можете переопределить это поведение, добавив"shrink-to-fit=no"
к вашему метатегу, как показано ниже. Добавленную стоимость позволит предотвратить страницу от масштабирования, чтобы соответствовать область просмотра.
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
короче говоря, добавление этого в метатег viewport восстанавливает поведение pre-Safari 9.0.
пример
здесь работал наглядный пример, который показывает разницу при загрузке страницы в двух конфигурациях.
Красная секция-это ширина видового экрана, а синяя секция расположена вне начального видового экрана (например
left: 100vw
). Обратите внимание, как в первом примере страница масштабируется подходит, когдаshrink-to-fit=no
опущен (таким образом, показывая содержимое вне видового экрана) и синий контент остается вне экрана в последнем примере.код для этого примера можно найти по адресу https://codepen.io/davidjb/pen/ENGqpv.
без сокращения-к-пригонки указан
С shrink-to-fit=no