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