Html CSS flex基础不适用于IE

我这里有一个密码笔-

我有一个简单的导航样式布局，带有链接和选择菜单

在较小的屏幕上，我希望选择菜单位于底部，并且是100%宽度

我使用flex和flex订单和基础进行了此工作

我的问题是IE，layput根本不起作用（我没有访问IE的权限，但有人告诉我）

我认为这是IE处理基础的方式

有没有一种方法可以使用flex在IE中修复此布局

<section class="nav-bar">

    <div class='o-container '>

        <div class='nav-bar__items'>

            <div class="nav-bar__items-linkOne">
                <div class="">
                    <span>Link One</span>
                </div>
            </div>

            <div class="nav-bar__items-linkTwo">
                <span>Link Two</span>
            </div>

            <div class="nav-bar__items-linkThree">                
              <span class="o-svg-text__text-left">Link Three</span>   
            </div>

            <div class="nav-bar__items-select">
                <div>
                <span>Select: </span>
                    <select>
                      <option>Select Option here</option>
                      <option>Select Option here</option>
                      <option>Select Option here</option>
                      <option>Select Option here</option>
                      <option>Select Option here</option>
                      <option>Select Option here</option>
                      <option>Select Option here</option>
                    </select>
                </div>
            </div>

        </div>

    </div>

</section>

链接一
链接二
链接三
选择：
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项

只需删除

justify content:flex end来自
和u项目
规则

原因是IE不喜欢将
justify content
和自动边距结合在一起，因此通过删除它，它可以在跨浏览器中正常工作


堆栈片段


.o-container{
宽度：90%；
右边距：自动；
左边距：自动；
}
.导航栏{
背景颜色：浅绿色；
填充：16px0；
宽度：100%；
}
.导航栏项目{
对齐项目：居中；
显示器：flex；
柔性包装：包装；
/*对齐内容：柔性端；已删除*/
最小高度：40px；
}
.nav-bar_u_项目-linkOne{
右边距：自动；
}
.nav-bar_u_项目-link三、.nav-bar__项目-link二{
左侧填充：8px；
}
.nav-bar_u_项目-Link2{
右边填充：8px；
左边距：20px；
}
.nav-bar\uuuu项目-选择{
显示：块；
弹性基准：100%；
边缘顶部：20px；
}
.nav-bar\uuu项目-选择{
宽度：100%；
}
@介质（最小宽度：1366px）{
.o形容器{
最大宽度：1366px；
}
}
@介质（最小宽度：918px）{
.导航栏{
顺序：1；
填充：10px0；
}
.导航栏项目{
顺序：1；
}
.nav-bar_u_项目-link三、.nav-bar__项目-link二{
顺序：3；
}
.nav-bar_u_项目-Link2{
顺序：3；
}
.导航栏项目链接三{
顺序：4；
}
.nav-bar\uuuu项目-选择{
弹性基础：自动；
顺序：2；
边际上限：0；
}
.nav-bar\uuu项目-选择{
宽度：350px；
}
}

链接一
链接二
链接三
选择：
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项
在此处选择选项