Jump to content

Как убрать горизонтальный скролл на сайте при просмотре с iphone X в браузере Google Chrome?


Recommended Posts

Всем доброго времени суток.

При просмотре сайта через десктопные браузеры все элементы и экран показываются ровно соответствуя медиа запросам. Точно так же - все отображается ровно если в Chrome выбрать отображение сайта как с iPhone X c перевернутым экраном. Но если зайти на сайт с iPhone X с браузера Google Chrome, и перевернуть экран, то во первых - появляется горизонтальный скролл, во вторых - при переворачивании экрана обратно слетает полностью мобильный вид сайта. Что касается просмотра сайта через браузер Safari на iPhone X, все отображается ровно.

Прилагаю видео - экран запись с iPhone X.


Ссылка на видео - https://disk.yandex.ru/i/BI2go6yL2gtxQQ.
Ссылка на сайт - http://grillgrad.ru/

Прошу помочь кто может мне в этом вопросе. Я понимаю, что скорее всего верстка кривая где-то или где-то нарушены правила оформления через СSS.

Edited by guram07
Link to post
Share on other sites

Я смог воспроизвести Вашу проблему, но сказать в чем причина мне сложно. Дело в том, что дебажить такую ситуацию сложно. При данных обстоятельствах devTool недоступен. Даже в BrowserStack отсутствует отладка Chrome/iOS.

Попробуйте по-блочно прятать блоки в вёрстке пока не найдёте тот, из-за которого возникает проблема. Далее скрывайте элементы блока, что бы найти тот элемент, который некорректно влияет на отображение. Останется изучить стили и найти те, которые работают не как ожидается.

Link to post
Share on other sites

Нельзя доверять режиму эмуляции смартфона. Он сильно обманывает. 

Если очень нужна консоль при работе над мобильной версией со смартфона используйте настройку логирования через ADB. 

Работать неудобно к сожалению. 

Link to post
Share on other sites
08.03.2021 в 14:34, klierik сказал:

Я смог воспроизвести Вашу проблему, но сказать в чем причина мне сложно. Дело в том, что дебажить такую ситуацию сложно. При данных обстоятельствах devTool недоступен. Даже в BrowserStack отсутствует отладка Chrome/iOS.

Попробуйте по-блочно прятать блоки в вёрстке пока не найдёте тот, из-за которого возникает проблема. Далее скрывайте элементы блока, что бы найти тот элемент, который некорректно влияет на отображение. Останется изучить стили и найти те, которые работают не как ожидается.

Благодарю. Попробую.

10 часов назад, Full-R сказал:

Нельзя доверять режиму эмуляции смартфона. Он сильно обманывает. 

Если очень нужна консоль при работе над мобильной версией со смартфона используйте настройку логирования через ADB. 

Работать неудобно к сожалению. 

Спасибо. Попробую для начало обойтись без консолей и сервисов.

Это хромовский баг. Дело не только в моем сайте.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • 3 Опрос

    You do not have permission to vote in this poll, or see the poll results. Please sign in or register to vote in this poll.
  • Обсуждения

    • Почему при адаптиве налазят блоки друг на друга?
    • Как правильно сделать оформить header используя только html и css  чтобы получилась как на этом макете Почему у меня правое меню постоянно плавает и как кнопку поиска правильно спозиционирорвать в самой форме чтобы она никуда не уезжала? Что не так в моем коде? https://jsfiddle.net/kjgydnfs/27/
    • Спасибо!!!     А почему в этом задании перезаписав значение  для псевдоэлемента after на то что ниже по коду, он перекрыл другой псевдоэлемент before, соответственно убрав половину видимой области этого псевдоэлемента. Почему, например, не before выше чтобы перекрыть after?
    • Здравствуйте. Не обязательно делать одну линию через 3 блока. Можно её реализовать как отдельный блок, конфигурируемый, с точкой. Позиционировать в рамках каждого блока-родителя
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy