Javascript IE9中的灵活布局

我想用一个div中的列来构建布局。 问题是在InternetExplorer9中没有正确显示它们。 对于chrome/firefox，我使用了

display:flex

，这样一切都很容易

当我在IE9中打开时会出现问题。显示的列没有宽度和高度。 我试过了，但没能成功：

我尝试的是： HTML:

        <div style="height: 100%">
        <div id="boxwrapinner">
            <div id="box1" ></div>
            <div id="box2"></div>
            <div id="box3"></div>
        </div>
    </div>

也许有人用过flexie，可以告诉我除了导入

.js

lib文件外，还需要什么

还将专门解决IE9如何实现DIV egzmpl的列布局：

---

我已经对此进行了一些讨论，我认为问题在于div是display:block。我把它改为内联块，效果很好

#博克斯拉平纳{
显示器：flex；
弯曲方向：行；
}
.盒子{
弹性：133%；
高度：200px；
宽度：33%；
显示：内联块；
}
#框1{
边框：1px纯红；
}
#框2{
边框：1px纯红；
}
#框3{
边框：1px纯红；
}

您必须为元素初始化Flexie。仅当“高度：200px；”时，请参见docs.works中的“创建新的弹性对象”部分以像素为单位设置。也许有可能用

height:100%

或另一种方式来绘制所有空间？？height:100%不起作用，不幸的是，P.S.哦，我想出来了，只需使用

display:table cell用于盒子，你甚至不需要所有flexbox的东西
表格单元格
示例在IE9中对我不起作用是的，我忘了。我在其中一个div中添加了一些文本。因此，如果您添加一些lipsum或其他div，则其他div应延伸到最大div的高度。但是如果你真的使用这种布局，其中一个div可能有足够的内容来适应屏幕，所以这应该不会是一个问题
    #boxwrapinner {
  display: box;
  box-orient: vertical;
  box-direction : reverse;
  width:100%;
  height:100%;
}

#box1 {
box-ordinal-group: 2;

    border: 1px solid red;
}

#box2 {
box-ordinal-group: 2;

    border: 1px solid red;
}

#box3 {
box-ordinal-group: 2;
    border: 1px solid red;
}