Flexbox 在 IE 或移动浏览器中不起作用答案

【问题标题】：Flexbox not working in IE or mobile browsersFlexbox 在 IE 或移动浏览器中不起作用
【发布时间】：2015-05-20 01:24:57
【问题描述】：

我正在制作这个网站：http://cycleswap.nl/

如here 所述，我使用CSS flexbox 将页脚粘贴到页面底部。我更具体地使用display: flex、flex 和flex-direction: column。这包括我能找到的 flexbox 的所有现有旧版支持和浏览器前缀。

在 Chrome 和 Firefox（Chrome 移动版）中一切正常，但在 IE 和默认的 Android 浏览器中，我遇到了各种错误。

IE 11（可能还有其他版本）：完全出故障了。页脚跳到（几乎）页面顶部。 SCREENSHOT.

Android 浏览器： 看起来flex-direction 完全被忽略了。页脚显示在页面的右侧。 SCREENSHOT.

首先，不要告诉我这些浏览器不支持 CSS flexbox，因为它们支持。在两种浏览器中打开 this W3Schools demo 时，这一点很清楚。它们都完美地显示了 div，包括flex-direction。肯定有不同的问题。

我的 CSS 与 this 基本相同。

如果您需要任何其他信息，请告诉我！任何帮助表示赞赏！

【问题讨论】：

【解决方案1】：

好吧，我设法解决了。对于任何想知道如何的人：

我在页脚添加了flex: 0 1 auto;。这为 IE 修复了它。

对于Android浏览器，我将display: box;和box-orient: vertical添加到body。这增加了一些缺失的遗留支持，从而解决了问题。

【讨论】：