Это своего рода проблема с окном просмотра в мобильном Safari, но вы можете получить тот же эффект, уменьшив ширину окна браузера вашего рабочего стола и прокрутив вправо, и вы увидите, что ваш фон начинает выпадать.
Это потому, что когда вы устанавливаете width:100% в свои #top и #header деления, вы говорите им изменить размер на ширину содержащего элемента, который в данном случае является окном браузера, ( или окно просмотра). Вы не говорите им изменить размер содержимого внутри.
Ширина окна просмотра по умолчанию для Mobile Safari 980px, поэтому он использует 980px в качестве ширины содержащего элемента для ваших элементов div. Вот почему ваш макет, который составляет около 1050 пикселей, отсекает свой фон.
Вы можете исправить это для мобильного Safari, непосредственно установив его область просмотра (см. Документы Apple ) или добавив min-width: ширину вашего дизайна в пикселях ; на ваш body. Mobile Safari будет использовать значение min-width для настройки своего окна просмотра, а также не допустит его появления в настольных браузерах.