Div宽度取决于其内部的图像宽度

Question

需要CSS帮助。

我有一个向左浮动的div，里面是具有固定高度和自动宽度的图像。我希望主DIV宽度与图像宽度完全一致。

<div class="item">
   <img src="http://upload.wikimedia.org/wikipedia/commons/4/49/Sports_shoes.jpg" alt="" />
   <a href="">Name here</a>
</div>

FIDDLE - 您可以看到该名称位于图片的右侧，但它应位于底部。

那么，有没有办法让DIV class =“item”总是拥有图像的宽度。如您所见，图像宽度可以不同。

我正在寻找cross borwser解决方案，这意味着显示：table-cell;不是解决方案，因为IE7 -8不支持它。

* 我的jquery脚本块向左浮动，需要帮助

Answer 1

制作图片display: block。 <img>元素默认为内联。

现场演示： http://jsfiddle.net/szPdR/1/

对于IE支持和其他棘手的浏览器使用jQuery，请参阅此FIDDLIE

Answer 2

使用CSS

div {
    width:auto;
}