HTML 置换选择选项

Question

下面的代码乍一看似乎可以工作，但是 FF(目前正在 FF26 上测试)正在取代选择选项并且之后不工作(无法选择选项)。在 Chrome 35 中没有问题。这是一个 FF 错误，可能是对 flexbox 的部分支持等等？

HTML

<div class="order-item-new">
 <select id="item" class="select" form="order-form" name="order[]">
  <option value="1">One</option>
  <option value="2">Two</option>
 </select>
</div>

CSS

.order-item-new
{
    -moz-box-direction: normal;
    -moz-box-flex: 0;
    -moz-box-orient: horizontal;
    -moz-box-pack: center;
    background: linear-gradient(to right, rgba(255, 255, 255, 0.15) 18%, rgba(61, 145, 153, 0.15) 50%, rgba(255, 255, 255, 0.15) 84%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    display: flex;
    flex: 0 1 45px;
    flex-direction: row;
    justify-content: center;
    text-align: center;
}

.order-item-new select
{
    -moz-box-flex: 0;
    flex: 0 1 120px;
    margin: 7px 10px;
}

示例:http://jsfiddle.net/wJ4H9/10/

Answer 1

来自 caniuse.com , Firefox 30 及更高版本支持 flexbox，但早期版本不支持。