Неверное значение увеличения при переходе от пейзажа к портрету - PullRequest
Новая
       5

Неверное значение увеличения при переходе от пейзажа к портрету

0 голосов
/ 12 сентября 2018

У меня есть страница, настроенная для использования: 

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

Моя страница построена так: 

<html>
  |
  |__<body>
        |
        |__<mainWrapper>  
                |
                |__<headContainer>
                        |   
                        |__<pageHeader>

html оформлен в виде: 

margin: 0;
padding: 0;
height: 100%;

body оформлен в виде: 

width: 100vw;

mainWrapper: 

height: 100%;
width: 100vw;

headContainer: 

background: #475679;
width: 100vw;

pageHeader: 

position: relative;
max-width: 1275px;
height: 89px;
margin: 0 auto;

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

Когда я затем раскручиваю телефон на 90 градусов, страница корректируется, снова заполняя всю ширину доступной области (исключая печально известную насечку), покрытую заголовком, и коэффициент масштабирования полностью уменьшается.

Однако, когда я снова перевожу страницу в портретный режим, верхний колонтитул теперь обрезается примерно на 30-40 пикселей с правой стороны. Мне нужно ущипнуть, чтобы сбросить масштаб, и тогда я могу видетьснова весь контент.

Я много пытался это исправить и тоже провел тщательное исследование.нашел много статей о подобной проблеме с iOS, но она, по-видимому, была исправлена ​​в iOS 6. Я также попытался применить к решению три различных решения на основе JavaScript, а также одно решение только для CSS, но они этого не сделалиработать вообще - также я позже узнал, что все они были опубликованы много лет назад.

Так что на данный момент у меня нет вариантов.

Может быть, кто-то имел эту проблему и знает, чтоделать, где искать или куда идти?

...