css - 是否可以将可变宽度的内容居中，纯粹来自 CSS 的自动溢出 div？

Question

我已经阅读了几个类似的问题，但没有一个适用于这种情况。

有一个 div，其中包含单元格。每个单元格大小相同。 div 应该是可变宽度的，并且允许溢出。将有更多的单元格可以放入一行。问题是，内容是左对齐的。请在此处查看示例:http://jsfiddle.net/gpcpfbmb/

<div id="holder">
  <div id="cell">
    <img width="160" height="100" src="http://lorempixel.com/160/100/" /><br />Caption
  </div> <!-- ... etc -->
</div>

这可以通过 JavaScript 解决:编写一个函数来测量屏幕宽度，计算列数，然后将 div 的宽度设置为列数 * 单元格宽度像素。 (例如，在示例中，如果您看到 3 列，并且在这种情况下单元格宽度为 170 像素，则 3 * 170 = 510，将宽度设置为 510px 将给出“完美”结果。但是，一旦调整浏览器窗口的大小，可变宽度和自动溢出的所有好处都将丢失。)

那么:仅 CSS 是否可以让单元格居中？

Answer 1

将单元格从 float:left; 更改为 display:inline-block; 并将 text-align:center; 添加到父级.

http://jsfiddle.net/gpcpfbmb/2/