用于页面布局的Flexbox？

Question

我试图得到一个想法，如果我应该开始使用flexbox网站/ webapp布局设计而不是浮动div等。

但我收到混合消息。在一个网站上，他们说Flexbox现在是页面布局的“圣杯”： http://philipwalton.github.io/solved-by-flexbox/demos/holy-grail/

然而Tab Atkins创建css3 flex规范的人有一个页面，名为“为什么flexboxes不适合页面布局” http://www.xanthir.com/blog/b4580

我看了这个视频：http://vimeo.com/98746172

所以我的结论是，他的意思是它不应该被用于复杂的页面布局。而且显示：网格会更好。但是，网格可能需要几年才能到达所有流行的浏览器。

所以我的问题是，现在是flexbox更好地创建页面布局比当前的解决方案（div浮动，显示：表格单元格，内嵌块等），是flexbox我应该使用直到电网出来？

p.s我知道flexbox与旧版浏览器不兼容。但我在这里假设性地谈论这个问题，让我们假设这不是问题。

Answer 1

我想你们误解了菲利普Flexbox解决方案。他没有说flexbox是布局的圣杯，布局本身被称为圣杯。

选项卡提供了一些优点，但这并不意味着Flexbox不是我们目前针对特定布局的最佳解决方案。

简单

将一个Flexbox，就使你的HTML或CSS更简洁，更容易理解和维护？使用flexbox可以让你消除黑客行为，例如删除内联块元素上的空白或通常需要display: table的额外标记。

性能

Flexbox的元件是慢一点呈现比浮动或内联块元件。但是，除非您的页面上有数百个Flexbox，否则这是您在优化页面速度时需要考虑的最后一件事。有时使用flexbox可以大幅减少CSS的数量。

灵活性

Flexboxes非常灵活（双关不打算）。您可以使用其他方法重新排列可能非常困难或不可能的元素顺序。

当做简单的事情，如双列布局，我仍然会使用浮动。也就是说，如果您需要Flexbox为您的布局提供的功能，或者它简化了您的HTML或CSS，那就去做吧！从长远来看，网格布局可能更适合，但是它们还没有在大多数浏览器中实现。