Как установить высоту div такой же как высота его background-image?

Question

[Иван]

Есть div который содержит background-image. Ширина и высота этого самого background-image меняется в зависимости от разрешения экрана. Нужно как то с помощью CSS поставить div-у высоту как у его background-image.

Answer 1

[Юрий Янин]

Хм... может просто добавить div элементу, тоже зависимость от разрешения?

есть вариант с JS

var img = new Image();
img.onload = function(){
 $('.divclass').css('width', this.width + 'px');
};
img.src = $('.divclass').css('background-image');

Соответственно в свойстве div должен быть Background-size: 100% 100%;

Answer 2

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

Так сделать нельзя, только если вместо фона вставить картинку и задать ей стили:

img {
    max-width: 100%;
    height: auto;
}

Comments

[Юрий Янин]

Почему нельзя то?

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

Может как то и можно сделать, но это костыли, а если без костылей, то поможет только резиновая картинка

[Иван]

Александр Зубарев: но картинка должна быть задним фоном. z-index и float не помогают убрать ее так чтобы она не мешала остальному контенту размещенному в этом же диве

[ankly]

Иван Сараев: используй position: absolute

[Иван]

SelenIT2: не совсем - у меня некоторые элементы должны быть над картинкой. Проблему решил но совсем не так как хотелось бы.