Div не охватывает полную ширину на iphone

Question

Спасибо, что прочитали это! У меня проблема с цветными полосами (div), чтобы достичь полной ширины на iphone. Когда я смотрю на нее на своем ноутбуке и вытягиваю окно как можно более узким и прокручиваю всю дорогу вправо, он не обрезается. Когда я просматриваю его на своем iphone, на правой стороне верхней серых полосок всегда есть область, а внизу внизу - белый div, где проходит фон. Я, очевидно, не очень опытен с ПК на мобильный, и я ценю любую помощь и совет!

сайта Ссылка: http://ekdesignportfolio.info/test/index4.html

Спасибо!

Answer 1

Я не уверен на 100%, что здесь происходит, но я просто немного оглянулся на вашем сайте, и похоже, что короткая серая панель имеет что-то вроде вашего backstretch.js или вычисления вашего тело. На телефоне ваше тело вычисляет 980 пикселей (по крайней мере, тот, который я проверил), а затем у вас есть минимальная ширина, равная 1050px. Но ваше тело даже не покрывает 100%, вместо этого оно охватывает около 2/3 страницы, а ваш серый бар вычисляет ширину по отношению к телу, минимально 1050p.

У вас есть множество настроек минимальной ширины, которые не будут хороши для мобильных устройств, если вы не измените их с помощью медиа-запросов с меньшей шириной или чем-то еще. Если честно, я бы использовал типичный фон css вместо этого сценария jquery, потому что это своего рода перебор. Попробуйте что-то вроде:

.background-div { 
    background: url(images/background-image.png); 
    background-size: cover; (or contain, depending on what you want) 
} 

Надеюсь, это поможет хотя бы немного.