Правильное адаптивное изображение в фоне. Как сделать?

Question

[Владимир]

Пытаюсь наколдовать резиновую картинку-фон в div-блоке. Чтобы при изменении размера экрана, эта самая картинка сжималась по ширине/высоте.
Столкнулся с такой проблемой: если ей не присвоить конкретное значение в пикселях (поставить height:auto) -картинка не показывается. ну а соответственно не изменяется размер при таких значениях :(

{background-image: url(/uimg/bg-up.png);
width: 100%;
max-width: 1160px;
background-repeat: no-repeat;
height:260px;}

Answer 1

[Александр Зубарев]

background-size

Comments

[Владимир]

Ознакомился ранее. Ни cover, ни contain не выводят картинку. Только при указании точно в пикселях картинка есть, но она обрезается родительским дивом. Можете дать пример?

[Александр Зубарев]

Если не задать высоту, то да никак так не сделать, так как фоновая картинка не может распирать контейнер в котором он находиться. Только если выводить реально картинку но адаптивную, вот пример: codepen.io/anon/pen/YyQqKE

[Владимир]

Александр Зубарев: вон оно чего) спасибо за ответ, а то я уже запарился с ним

[Александр Зубарев]

Да не за что, если реально помог можете отметить ответ как решение

[Владимир]

Александр Зубарев: Помогли и очень, отметил.

Answer 2

[Ivanq]

div:

width: 100%;
height: 100%;
background-image: ваша картинка;
background-size: cover;

Comments

[Владимир]

не выводит картинку -уже пробовал, потому и задаю вопрос.

.header-up{
width: 100%;
height: 100%;
background-image: url(/uimg/bg-up.png);
background-size: cover;
}

[Ivanq]

Владимир: а какой-нибудь простой fiddle дадите?

[Владимир]

в fiddle работает в процентах, а на юкозе делаю - нет(
jsfiddle.net/58dz9stq

[Ivanq]

Владимир: у вас там какая-то ерунда почему-то :(

[Владимир]

Ivanq: Александр Зубарев уже дал решение. Спасибо и вам за помощь ;)
Если не задать высоту, то да никак так не сделать, так как фоновая картинка не может распирать контейнер в котором он находиться. Только если выводить реально картинку но адаптивную, вот пример: codepen.io/anon/pen/YyQqKE

да, кусок вырвал из кода