菜单使用UL和李没有在Safari

Question

正确显示我是相当新的CSS，但我已经创建了悬停在背景视频网站http://www.peterboroughweddingdjs.com上的菜单。 这是一个简单的菜单，使用ul和li一起使用，它在除Safari之外的每一个浏览器都能正确显示。 在Safari中，它像列表一样堆叠菜单项，而不是像在Chrome中那样排成一排。这是我的CSS菜单。 为什么Safari会如此痛苦？

#menu-main-navigation { 
    list-style-type: none !important; 
    margin: 0; 
    padding: 0; 
    display: flex !important; 
    float: left: 
} 

任何帮助将不胜感激。 谢谢。

Answer 1

您需要-webkit到前缀Safari的使用Flexbox的的：

#menu-main-navigation { 
    list-style-type: none !important; 
    margin: 0; 
    padding: 0; 

    display: -webkit-box; 
    display: -webkit-flex; 
    display: -ms-flexbox; 
    display: flex; 
    float: left; 
} 

了解更多关于Can I Use。