CSS鄰接兄弟選擇器，Safari和<nav>元素

Question

在Safari 5.1.3中，我剛剛注意到，當編寫一個CSS鄰接兄弟選擇器（呃+之一）和引用<nav>元素時 - 瀏覽器無法遵守CSS 。

所以：

h1 + p { ... } /* works fine */ 
h1+p { ... } /* works fine */ 

和

h1 + nav { ... } /* works fine */ 
h1+nav { ... } /* but, does NOT work */ 

我和其他HTML 5個元素測試了這些（部分，文章，一邊），他們似乎很好地工作。直到你將一個導航元素加入混合中;然後它破裂。這是一個jsfiddle。

這證明令人沮喪，因爲我的導軌資產打包程序正在縮小CSS並取出不必要的空間。這對於IE7，Firefox，Chrome或Opera不是問題 - 但Safari 5 ..

其他人有過類似的情況嗎？知道爲什麼？知道一個方法來解決？

Answer 1

這絕對是一個錯誤的Safari和PC上使用Safari瀏覽器>錯誤報告給蘋果... Mac或幫助上>錯誤報告給蘋果...（你應該報告或工具欄按鈕如果它顯示在Safari工具欄上）。

最簡單的方法就是禁用CSS縮小，如果Asset Packager有一個選項。

如果沒有這樣的選擇，存在一個快速和骯髒的解決方法：如果你只有一個nav元素直接按照您h1，您可以使用general sibling selector ~而不是如Safari沒有出現任何問題與它：

h1 ~ nav { ... } /* works fine */ 
h1~nav { ... } /* works fine */ 

jsFiddle preview

如果你有以下的h1多個nav元素，你必須手動覆蓋樣式使用連續nav元素。