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

Question

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

0

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

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

Благодарю!

oliveandval 10 нояб. 2013, в 07:30

Источник

Теги:

html

css

iphone

width

1 ответ

Ещё вопросы

thesublimeobject · Answer 1 · 2013-11-10T12-52-00.000Z

Я не уверен на 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)
}

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

Спасибо за просмотр! Я забыл упомянуть, что хотел, чтобы фоновое изображение оставалось на месте при прокрутке, что, как я думаю, не будет работать с чистым фоном CSS (хотя я могу быть совершенно не прав). Я добавил мобильную таблицу стилей и уменьшил для нее шрифт nav, и это, похоже, решило проблему. Навигация еще не идеально отцентрирована, но, по крайней мере, она лучше, чем была. Мне все еще нужно проверить это на ipad в какой-то момент, чтобы увидеть, работает ли он там тоже, скрестив пальцы. Еще раз спасибо!
Вы должны быть в состоянии заставить фон оставаться на месте, но это может быть немного сложнее. Рад, что смог помочь. Если мой ответ был достаточно полезным, пометьте его правильно :).