Отзывчивый сайт масштабируется при переворачивании между Portrait и Landscape на iPad/iPhone

Я создал отзывчивый сайт, используя Twitter Bootstrap здесь: http://zarin.me/cce/

Отзывчивый дизайн отлично работает на iPad и iPhone, однако, когда я переворачиваю устройство с портрета на пейзаж, сайт масштабируется, а не адаптируется к экрану (сжимает экран).

Что мне не хватает? Это проблема с просмотром? Здесь единственный код окна просмотра, который у меня есть:

<meta content="width=device-width, initial-scale=1.0" name="viewport">

Спасибо заранее!

Ответы

Ответ 1

Вы также хотите добавить максимальный масштаб

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Ответ 2

При настройке максимальной шкалы на "1" она работает, она не позволяет пользователям увеличивать масштаб на любом месте вашего сайта. Не идеально подходит для пользователей. Вместо этого попробуйте этот Javascript, Исправление изменения iOS-ориентации

Ответ 3

Установите initial-scale=1.0 в мета:

<meta name="viewport" content="width=device-width,initial-scale=1.0" />

Затем установите -webkit-text-size-adjust:100%; в CSS:

body {
  -webkit-text-size-adjust: 100%;
}

Этот подход не мешает пользователю изменять масштаб вашего веб-сайта, но гарантирует, что текст не получит размер, автоматически настроенный браузером.

Ответ 4

Я видел, как это происходит, когда один из контейнеров на странице выпадает на 100%. На начальной странице отображается ок., Но при изменении ориентации дополнительная ширина становится как бы сильной, заставляя страницу масштабироваться, и обычно оставляет поле справа или слева. Стоит проверить все ваши медиа-запросы, чтобы убедиться, что нет каких-либо отступов или полей.

Ответ 5

Следующее работает для меня и позволяет пользователям увеличивать

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />

Ответ 6

Именно эта проблема возникла на Ipad 3 и IOS 7.1.2

Использование max-scale = 1 фиксировало его и позволяет масштабировать

Решение js не работает

Ответ 7

Если вы столкнулись с проблемой в основном в iPhone-X, попробуйте - Это работает для меня.