Задать вопрос
@Chekistchek

Правильное отображение background-image?

Как сделать, чтобы ширина подстраивалась и закрывала все доступное пространство, т.е. чтобы ширина была 100%. Когда ставлю 100% или убираю width картинка просто не отоброжается:
#p1JPG {
    height: 700px; 
    width: 2600px;
    background: url("../images/p1.JPG") center center no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.fixed {
    position: fixed;
}

<div class="fixed"><div id="p1JPG"></div></div>

В данном случае все нормально отображается, но на смартонах не работает background-attachment: fixed :
#p1JPG {
    height: 700px; 
    background: url("../images/p1.JPG") center center no-repeat fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

<div id="p1JPG"></div>
  • Вопрос задан
  • 160 просмотров
Подписаться 1 Оценить Комментировать
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Stepik
    Основы HTML и CSS
    2 недели
    Далее
  • OTUS
    HTML/CSS
    3 месяца
    Далее
  • beONmax
    Курс HTML / CSS
    1 месяц
    Далее
  • Бруноям
    Вёрстка на HTML и CSS
    3 месяца
    Далее
  • Международная Школа Профессий
    Онлайн-курсы HTML и CSS для начинающих
    3 недели
    Далее
  • Stepik
    Основы вёрстки с HTML и CSS
    1 неделя
    Далее
  • beONmax
    Верстальщик сайтов - HTML, CSS, Bootstrap, JavaScript
    1 месяц
    Далее
Решения вопроса 1
ivan_tataush
@ivan_tataush
Frontend Developer
у элемента с position: fixed; обязательно должна быть указана ширина. Или укажи
position: fixed;
left: 0;
right: 0;
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@krainoff99
#p1JPG {
    height: 700px; 
    width: 2600px;
    background: url("../images/p1.JPG") center center no-repeat fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы