我最近发现 Flexbox，当时我正在寻找一种使 div 具有相同高度的解决方案，具体取决于最高的高度。
我已阅读 following page在 CSS-tricks.com 上，它让我相信 flexbox 是一个非常强大的学习和使用模块。然而，这也让我想到 Twitter Bootstrap(和类似框架)提供与其网格系统相同的功能(当然还有很多额外功能)。
现在，问题是:flexbox 的优缺点是什么？有没有什么是 Flexbox 不能做的，而像 Bootstrap 这样的框架可以做的(当然纯粹是在谈论网格系统)？在网站上实现时，哪个更快？
我猜只有在网格系统的情况下，纯粹使用 flexbox 会更聪明，但是如果你已经在使用框架，有什么 flexbox可以加吗？
有什么理由选择 flexbox 的“网格系统”而不是框架的？
最佳答案
出于几个原因，flexbox 比 bootstrap 好得多:
Bootstrap 使用 float 来制作网格系统，许多人会说这不适用于 Web，而 flex-box 则相反，它通过保持元素的大小和内容的灵 active 来实现；与使用像素与 em/rem 的区别相同，或者仅使用边距和填充来控制 div，而从不设置预定义的大小。
Bootstrap，因为它使用 float ，需要在每一行之后进行 clearfix，否则你会得到不同高度的未对齐的 div。 Flex-box 不这样做，而是检查容器中最高的 div 并坚持其高度。
我会在 flex-box 上使用 bootstrap 的唯一原因是缺乏浏览器支持(主要是 IE)(已经死了)。有时即使 Chrome 和 Safari 使用相同的 webkit 引擎，您也会得到不同的行为。
编辑:
顺便说一句，如果您面临的唯一问题是等高列，那么有很多解决方案:
您可以在父级上使用
display: table，在子级上使用display: table-cell;。见 How to get same height in display:table-cell您可以在每个 div 上使用绝对定位:
position:absolute； 顶部:0； 底部:0；- 还有 jquery/JS 的解决方案，还有一个暂时想不起来的解决方案，以后会尝试添加。
编辑 2:
同时检查 http://chriswrightdesign.com/experiments/flexbox-adventures/ & https://scotch.io/tutorials/a-visual-guide-to-css3-flexbox-properties关于 flex-box 的工作原理。
编辑 3: https://kyusuf.com/post/almost-complete-guide-to-flexbox-without-flexbox
关于html - Flexbox vs Twitter Bootstrap(或类似框架)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27599396/