Проблема:
iOS8/Safari, похоже, не понимает/не поддерживает медиа-запросы, содержащие единицы области просмотра, такие как: (max-height: 175vw)
. Однако он отлично работает на устройствах iOS9. Я пытался использовать max-aspect-ratio
и max-device-aspect-ratio
, но они также игнорируются.
Кто-нибудь знает, почему это не работает, или знает какой-либо другой способ создания медиа-запросов, которые не привязаны к пропорциям/соотношениям сторон вместо конкретных размеров экрана?
Объяснение (или зачем мне это вообще нужно?)
Мы работаем над приложением для ios/android с использованием Cordova, и вместо того, чтобы беспокоиться о точках останова и всех различных размерах экрана, мы решили довольно широко использовать единицы области просмотра и беспокоиться только о нескольких пропорциях соотношения сторон/размера экрана.
Итак, прямо сейчас стили, которые у нас есть, отлично работают на таких устройствах, как iPhone 5, 6, 6+, большинстве устройств Android (и любом другом устройстве, которое имеет такие же пропорции или что-то среднее между ними).
Теперь такие устройства, как iPhone4 и iPad, имеют совершенно разные пропорции; они более «квадратные», как говорится. Чтобы учесть это, нам просто нужен медиа-запрос для пропорций 7/4 и ниже, а (max-height: 175vw)
отлично работает на устройствах iOS9 и Android (мы используем Crosswalk для Android, поэтому рассмотрите также Chrome), но, похоже, не работает. на iOS8/сафари.
Обновление:
Просто возникла идея. Сейчас я буду использовать (max-height: 175vw)
, и это должно исправить все устройства Android (по крайней мере 4.4, которые мы поддерживаем) и устройства iOS9. После этого мне может понадобиться дополнительный медиа-запрос для iPhone4 и/или iPad.