我认为这取决于你需要它做什么:

If you need it just to get 3 columns layout, I'd suggest to do it with float. If you need it for menu, you can use inline-block. For the whitespace problem, you can use few tricks as described by Chris Coyier here http://css-tricks.com/fighting-the-space-between-inline-block-elements/. If you need to make a multiple choice option, which the width needs to spread evenly inside a specified box, then I'd prefer display: table. This will not work correctly in some browsers, so it depends on your browser support.

最后，最好的方法是使用flexbox。这个规范已经改变了几次，所以它还不稳定。但一旦最终确定，这将是我认为最好的方法。

我更喜欢内联块，尽管浮动也很有用。旧的ie不能正确渲染表格单元格(inline-block也不行，但是有缩放:1;*显示:内联黑客，我经常使用)。如果你的子节点的高度小于父节点的高度，浮动会把它们带到顶部，而内联块有时会搞砸。

大多数情况下，浏览器会正确地解释所有内容，当然，除非它是IE。你总是要检查以确保IE不会糟糕——例如，表格单元格的概念。

在所有现实中，是的，这归结为个人偏好。

一种可以用来消除空白的技术是将字体大小设置为0给父元素，然后将字体大小返回给子元素，尽管这很麻烦，而且很恶心。

我认为这取决于你需要它做什么:

If you need it just to get 3 columns layout, I'd suggest to do it with float. If you need it for menu, you can use inline-block. For the whitespace problem, you can use few tricks as described by Chris Coyier here http://css-tricks.com/fighting-the-space-between-inline-block-elements/. If you need to make a multiple choice option, which the width needs to spread evenly inside a specified box, then I'd prefer display: table. This will not work correctly in some browsers, so it depends on your browser support.

最后，最好的方法是使用flexbox。这个规范已经改变了几次，所以它还不稳定。但一旦最终确定，这将是我认为最好的方法。

I usually use float: left; and add overflow: auto; to solve the collapsing parent problem (as to why this works, overflow: auto will expand the parent instead of adding scrollbars if you do not give it explicit height, overflow: hidden works as well). Most of the vertical alignment needs I had are for one-line of text in menu bars, which can be solved using line-height property. If I really need to vertical align a block element, I'd set an explicit height on the parent and the vertically aligned item, position absolute, top 50%, and negative margin.

我不使用display: table-cell的原因是，当你的条目超过了站点的宽度时，它会溢出。Table-cell将强制用户水平滚动，而float将包装溢出菜单，使其在不需要水平滚动的情况下仍然可用。

关于float: left和overflow: auto最好的一点是，它可以一直工作到IE6，而不需要任何修改，甚至可能更久。

在你问的选项中:

浮:左; 我不喜欢浮动，因为需要有额外的标记来清除浮动。就我而言，整个浮动概念在CSS规范中设计得很糟糕。但我们现在对此无能为力。但重要的是它确实可以工作，而且它可以在所有浏览器(甚至IE6/7)中工作，所以如果你喜欢它，就使用它。

如果您使用:after选择器清除浮点数，则可能不需要使用额外的清除标记，但如果您希望支持IE6或IE7，则不需要使用此标记。

显示:内联; 这不应该用于布局，除了IE6/7，其中display:inline;Zoom:1是对内联块的破碎支持的后退hack。 显示:inline-block; 这是我最喜欢的选择。它在所有浏览器上都运行良好且一致，但对于支持某些元素的IE6/7有一个警告。但请参阅上面的解决方案来解决这个问题。

关于内联块的另一个重要警告是，由于内联方面的原因，元素之间的空白被视为文本单词之间的空白，因此元素之间可能出现空白。有一些解决办法，但没有一个是理想的。(最好是元素之间不要有空格)

显示:表格单元; 另一个问题是浏览器兼容性问题。年长的ie根本不能使用这个。但即使对于其他浏览器，值得注意的是，table-cell被设计用于样式为table和table-row的元素内部;孤立地使用表格单元格并不是预期的方式，因此不同的浏览器可能会对它进行不同的处理。

其他你可能错过的技巧?是的。

Since you say this is for a multi-column layout, there is a CSS Columns feature that you might want to know about. However it isn't the most well supported feature (not supported by IE even in IE9, and a vendor prefix required by all other browsers), so you may not want to use it. But it is another option, and you did ask. There's also CSS FlexBox feature, which is intended to allow you to have text flowing from box to box. It's an exciting feature that will allow some complex layouts, but this is still very much in development -- see http://html5please.com/#flexbox

为了补充Spudley的答案，如果你知道列的宽度，也可以使用绝对位置和边距。

对我来说，选择方法时的主要问题是是否需要列填充整个高度(等高)，其中table-cell是最简单的方法(如果您不太关心旧的浏览器)。