如何使div宽度适合嵌套的内嵌图像？

Question

我在div中有几个内联图像 我无法让div将其宽度调整为其内嵌图像 我该怎么办？

我试过制作父div

显示：内联块，内联，浮动：左

但它们都不起作用......

HTML：

<div id="box1">
  <div id="box2">
    <img src="1.jpg">
    <img src="2.jpg">
    <img src="3.jpg">
  </div>
</div>

的CSS：

#box1{
width:600px;
overflow:hidden;

} 

#box2{
display:inline-block;
}

#box2 img{
vertical-align:top;
display:inline;
}

Answer 1

执行float:left应该有效 - 请参阅我的小提琴：http://jsfiddle.net/VasXf/

注意：我在使用<br />的图片之间添加了换行符，这可能是您的问题？

Answer 2

您的图像也需要display: inline-block;：）

请参阅：http://jsfiddle.net/VasXf/2/

Answer 3

我能解决这个问题的唯一方法是获取box2，如下所示：|

#box2{
white-space:nowrap;
}

如果有人有任何其他解决方案，请发布