Тестирование IPad 4-го поколения/Retina Display

Question

EDITED 26 августа 2015

Хорошо, этот вопрос может быть немного грубо, потому что этот проект все еще находится в Dev этапах так юридически я не имею права делить его еще показать моя проблема в реальном времени.

Проблема, с которой я сталкиваюсь, заключается в том, что я создаю сайт для клиента, и когда мы начали фазы тестирования, я прошел каждый тест, за исключением iPad 4-го поколения. Затем мы начали обнаруживать, что весь мой код действительно выглядит чудовищно большим, если смотреть в ЛЮБОЙ дисплей сетчатки (4-й/5-й ген, iPad-воздух).

Проблема не в том, что свойства vh/vw не работают, проблема в том, что внезапно 20vh (20% высоты просмотра) массивный. Я использую заполнение внутреннего объекта контейнера для вертикального центрирования всего содержимого в его родительском контейнере с помощью padding-top: 20vh; padding-bottom: 20vh;.

Я пытался здесь решить проблемы, связанные с таргетингом на ТОЛЬКО дисплеи сетчатки и никто не работал вообще. Вот что я пытался предназначаться сетчатку с ...

• @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) { /* STYLES GO HERE */}
• @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) { /* STYLES GO HERE */}
• <meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1, user-scalable=0">

Проблема в том, что делают все эти методы также цели IPad 1/2/3, а также по какой-то причине, и это испортит мой ранее написанный код.

Answer 1

vh Единицы измерения - это новая единица измерения css3, чтобы старые браузеры игнорировали их. Таким образом, вы обычно используете резервную копию с единицами vh. Что-то вроде:

.container { 
height: 1024px; 
height: 100vh; 
} 

Браузеры, которые не понимают, будут пропускать его и использовать пиксели.

Однако Can I Use упоминает, что модули vh не поддерживаются полностью до iOS 8. И упоминается, что в предыдущих версиях Safari для iOS существует некоторая «ошибка». Затем он предоставляет a work around вопросу, что может быть полезно.

Так что, возможно, это так называемое ошибочное поведение - это то, к чему вы работаете.