html - css，将元素紧紧包裹在未指定数量的图像周围

Question

我有一个显示图像的元素。这个元素需要随着图像的数量水平增长。我事先不知道会有多少张图片。

我的问题是当图片很少时元素太宽了。它没有足够紧密地环绕图像。

http://jsfiddle.net/sXgzn/ (第一个示例有效，第二个示例无效。)

<div class = "outer">
  <img src = "xx" class = "inner" />
  <img src = "xx" class = "inner" />
  <img src = "xx" class = "inner" />
</div>

Answer 1

将 display:inline-block 添加到容器以收缩以适合，然后添加 font-size:0 以折叠周围的空白:sample fiddle