Chrome DevTools не дает точного мобильного просмотра по сравнению с реальным мобильным просмотром

Question

Я пытаюсь сделать мою веб-страницу удобной для мобильных устройств. Итак, я использую Chrome DevTools для разработки мобильной версии моей веб-страницы. У меня так, как я хочу, чтобы это выглядело в DevTools. Я загрузил его на свой веб-сайт и просмотрел на реальном мобильном телефоне, а объекты находятся не в тех же местах, что и в DevTools. Я использовал дизайн iPhone 6 в DevTools, а также просматривал его на реальном iPhone 6. Они не совпадают. У кого-то еще есть такая проблема? Я читал статьи об этом, но не знаю, как это исправить. Есть идеи? Должен ли я использовать другой эмулятор?

Это версия Chrome DevTools для iPhone 6:

Вот как это действительно выглядит на iPhone 6:

Answer 1

Технический писатель DevTools здесь. DevTools - это просто симулятор мобильных устройств. Это не может действительно симулировать iPhone. Поэтому всегда полезно проверить, как это выглядит на устройствах, которые вам небезразличны (как и вы). Я не думаю, что здесь есть какая-либо ошибка или проблема. Это просто случай, когда симуляция DevTools не отражает реальность на 100%.