Ответ 1
В Safari 9.0 используется Safari, по крайней мере, на момент написания статьи. Из "Что нового в Safari?" документация для Safari 9.0:
Изменения в окне просмотра
Метаданные Viewport с использованием
"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.