CSS Flexbox 适用于所有浏览器，但 Safari 除外

Question

所以我正在为一个网站做导航，我正在使用flexbox，它似乎适用于所有浏览器，除了safari？ 这是一个常见问题吗？

#nav ul{
    list-style: outside none none;
    margin: auto;
    padding: 0;
    display:-webkit-box;
    display:-moz-flex;
    display:-moz-box;
    display:-ms-flexbox;
    display:flex;
    width: 96.5%;
}
#nav ul li{
    display: inline-block;
    /*width: 9%;*/
    position: relative;
    -webkit-flex:1;
    -webkit-box:1;
    -moz-flex:1;
    -moz-box-flex:1;
    -ms-flex:1;
    flex:1;
}

Answer 1

这似乎解决了我的问题

#nav ul{
    list-style: outside none none;
    margin: auto;
    padding: 0;
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;
    width: 96.5%;
}
#nav ul li{
    /*width: 9%;*/
    position: relative;
    -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-flex: 1;         /* OLD - Firefox 19- */
    width: 20%;               /* For old syntax, otherwise collapses. */
    -webkit-flex: 1;          /* Chrome */
    -ms-flex: 1;              /* IE 10 */
    flex: 1;
}