html - Flex 元素不在 Firefox 中包装

Question

我在 Chrome 的 flex div 中有一个 div 列表:

但在 Firefox 中它只用一行进行水平滚动

我该怎么做才能不强制水平滚动？我希望在 Firefox 中像在 Chrome 中一样

#maindiv{
    margin: auto;
    width: 97%;
    border: 1px solid #F4F4F4;
    border-radius: 2px;
    margin-top: 10px;
    -webkit-justify-content: space-around;
    -webkit-flex-wrap: wrap;
    -moz-justify-content: space-around;
    -moz-flex-wrap: wrap;
    -ms-justify-content: space-around;
    -ms-flex-wrap: wrap;
    justify-content: space-around;
    flex-wrap: wrap;
    display: -webkit-flex;
    display: flex;
    display: -moz-box;
    -moz-box-pack: center;
    -moz-box-align: center;
    height: 395px;
    max-height: 395px;
    overflow-y: scroll;
}

#divslist{
    list-style: none;
    margin: 0px;
    float: left;
    position: relative;
    zoom: 1;
    -webkit-justify-content: space-around;
    -webkit-flex-wrap: wrap;
    -moz-justify-content: space-around;
    -moz-flex-wrap: wrap;
    -ms-justify-content: space-around;
    -ms-flex-wrap: wrap;
    justify-content: space-around;
    flex-wrap: wrap;
    display: -webkit-flex;
    display: flex;
    display: -moz-box;
    -moz-box-pack: center;
    -moz-box-align: end;
}

Answer 1

只是改变了css中的顺序

display: -webkit-flex;
display: flex;
display: -moz-box;

到

display: -webkit-flex;
display: -moz-box;
display: flex;

及其在 FF 28 中的工作。检查此 fiddle在 FF 和 chrome 中