CSS trick. bg-size auto 100% , min-height, responsive

Question

[Евгений Федоров]

Как задать свойство высоты блоку, которому написаны правилаbackground:url(../images.... и bg-size: auto 100%; так что бы блок был такой же высоты как и картинка. В респонсиве приходится менять высоту каждые 100 пикселей. height auto не помогло.
п.с.
Мы растянули картинку в блоке который динамически меняется в респонсиве. Как сделать так что бы блок был не меньше и не больше высоты картинки при её динамическом изменении ширины? Если не ставить height картинку как бг мы вообще не увидим.

Answer 1

[linoleum]

Если картинка в background - то никак, ибо на flow она никак не влияет. Можно вложить картинку в блок отдельным элементом, тогда высота блока будет не меньше высоты картинки (если не указано обратное).

Answer 2

[gopromax]

Вариант 1 (упомянут выше):

<div><img ... ></div>
img css: max-width: 100%;

Вариант 2:
jQuery plugin
https://github.com/srobbin/jquery-backstretch