Почему при responsive смещается тег body?

Question

[minaev007]

Есть такой код
https://jsfiddle.net/hmzfjuh8/

Проблема в том, что при тестировании в режиме responsive в chrome body соскакивает влево вверх, что влияет на отображение элемента в контейнере
Проблема решается путем создания в body контейнера, которому присваиваются стили, изначально определенные для body:
https://jsfiddle.net/hv86owzv/

При изменении ширины devtool без режима responsive смещения не происходит и все отображается корректно.
НО
Я хочу понять (самое главное) почему в принципе происходит смещение?
Также интересны альтернативные способы решения проблемы, например, без использования дополнительного контейнера.

Comments

[Gortyser]

Добавлять подобные стили для body, когда можно сделать контейнер - плохая идея.

[minaev007]

Gortyser, контейнер всегда можно сделать. Хотелось бы минимизировать разметку. Мне интересно понять причину такого поведения

[Андрей]

Ваш пример скопированный в html-файл и открытый локально в хроме работает нормально, ничто никуда не смещается

[minaev007]

Андрей, решил проверить через firefox. И таки да. Там все нормально. Но у меня в хроме в режиме responsive и с шириной 320px смещается. Первый скрин вопроса тому подтверждение. Может локальный глюк... имхо. Спасибо