flexbox vs tables，为什么我们需要flexbox？

Question

任何人都可以启发关于新的Flexbox布局模型如何比当前表格方式更好？ （显示：表格和所有这些都包含在我的案例中）？

在IE10下它根本不受支持，这在不久的将来并不是很好，我只是看不到桌面布局的任何好处。但是，互联网开始充满了这种新的CSS布局方法的“崇拜者”，我看到的所有例子都可以很容易地用正常的css完成而没有问题。

---

更新25.12.15：

我一直在使用flexbox，因为它们被引入现代浏览器并且已经停止使用display:table等等，因为flexbox更强大且易于使用。

Answer 1

在使用flexbox和使用表格显示值或浮点数来布局页面之间，我可以想到三个区别：

1. 能够重新排序元素而不管HTML源顺序，同时保持元素在正常流程中 - 您可以通过指定具有order属性的整数值来完成此操作。
2. 它比传统的浮动布局需要更少的输入（你不需要所有的伪元素用于清除目的）并且更加语义化，而使用浮动或表格进行布局显然不是。
3. 使用flex-grow和flex-shrink属性，灵活项目增长和缩小以根据祖先元素的尺寸填充水平和垂直空间的能力。

问题（正如你所指出的）是支持仍然很糟糕;事实上，Firefox仍然在实现旧版本的flexbox模块，因此您必须考虑到语法和行为方面的细微差别，具体取决于您使用的浏览器。不过已经说了很多，它是布局的未来，特别是对于经常出现的复杂网络应用程序。如果你可以做出不可避免的明智投资，那是值得学习的 - 以现在不能真正使用为代价。

我还建议您查看this smashing magazine article对flexbox的友好介绍（最近写的）

Answer 2

Flexbox模型比显示表更强大。例如，Flexbox支持从右到左语言的布局。确实如此，flexbox有点复杂，这是一个入门障碍。浮动和clearfix布局是一个（聪明的）黑客，不知何故，表格布局是一个黑客，flexbox是用于布局。

最近浏览器支持越来越好，有人说我们应该use it now。然而Bootstrap 3没有使用flexbox，但我可以想象下一个版本将会。

Answer 3

简单地说，这将是几年内有益的 。像许多先进的CSS技术，HTML5等一样，有些人会在未来几年内采用痛苦的后备和垫片/ shivs。

当浏览器将来支持它时，我们会举办派对，并且对那些不支持它们的'旧'浏览器感到厌恶：）。