Фон по ширине (и только) div-а. Как сделать?

midagent

Нужно чтобы фон был 100 процентным по ширине, но не по высоте. Если блок выше исходника фона, то просто повторять фон background-repeat по вертикали.

3 ответа

midagent

Укажите background-size 100% по ширине, a по высоте - auto

background-size: 100% auto;


midagent

Чтобы использовать фон на 100% ширины, надо прописать width: 100%; у блока div. НО, фон как background-image не будет виден, пока у блока нет никакой высоты. Так что, размер по-любому нужен для высоты(ты можешь его не указывать, если пишешь в блоке текст или добавляешь другие элементы).

.kek{
    width: 100%;
    height: 1000px;
    background-image: url("http://www.zooclub.ru/skat/img.php?w=700&h=700&img=./attach/12000/12669.jpg");
    background-repeat: repeat-y;
  }


midagent

.block {
  width:100px;
  height:500px;
  background-image:url('https://cdn.sstatic.net/Sites/stackoverflow/img/error-lolcat-problemz.jpg');
  background-size: 100% auto;
  background-repeat: repeat-y;
}

licensed under cc by-sa 3.0 with attribution.