исправлен фон для части сайта (div) в iOS
Я хочу иметь фиксированное положение фонового изображения, которое покрывает весь экрантолько для раздела моего сайта (на самом деле два раздела, но независимо друг от друга, поэтому нет никакой разницы). Я использую этот CSS на контейнере DIV раздела:
#wrapper {
background-image: url(../img/bg1_IMG_1509.jpg);
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
(Примечание: я использовал отдельные свойства вместо сокращенияbackground
надеясь, что это будет совместимо с большим количеством устройств и браузеров, но, похоже, это не так.)
Это работает более или менее хорошо на всех десктопах и браузерах, а также в некоторых браузерах на Android, но не на iOS. В iOS фон не только прокручивается, но и чрезмерно растягивается по вертикали, так что высота фонового изображения охватывает весь DIV, который имеет много контента и становится довольно высоким на мобильном устройстве, что приводит к большему менее одного пикселя взорвалась на экране. Так что ниfixed
ниcover
Работа.
Я знаю / читал ответы об обходных решениях с фиксированной позицией для iOS, которая использовала DIV внутри<body>
тег, который получилposition: fixed
и полноэкранное фоновое изображение. Но я не хочу этого навсе тело, но только в двух (независимых) разделах, и в этой ситуации этот обходной путь не может быть использован.