Flexbox无法在IE或移动浏览器中运行

时间:2015-03-17 14:42:48

标签: html css internet-explorer flexbox

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

将页脚粘贴到页面底部我正在使用CSS flexbox,如here所述。我使用display: flexflexflex-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 个答案:

答案 0 :(得分:1)

好吧我设法解决了。对于任何想知道如何:

的人

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

对于Android浏览器,我向display: box;添加了box-orient: verticalbody。这增加了一些遗漏的遗留支持,解决了这个问题。