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つの要素（余談セクション、記事、）でこれらをテストしてみた、彼らは正常に動作するように見えます。あなたがそのミックスにnav要素を入れるまで;それは壊れます。ここにはjsfiddleがあります。

これは、私のレール資産パッカーがCSSを小型化して不必要なスペースを取り除いていることを示すものです。これはIE7、Firefox、Chrome、Operaの場合は問題ではありませんが、Safari 5では問題ありません。

他の人は誰もいませんか？理由を知っている？修正する方法を知っていますか？

Answer 1

これは間違いなくSafariのバグであり、あなたがアップルにサファリ>バグレポートを使用してそれを報告しなければならない... Macやヘルプに> PC（またはツールバーのボタンにアップル...にバグレポートSafariツールバーに表示されている場合）。

最も簡単な方法は、Asset Packagerにオプションがある場合にCSSの縮小を無効にすることです。

それはそのようなオプションを持っていない場合は、迅速かつ汚い回避策が存在する：あなたが唯一の直接あなたのh1次1つのnavの要素を持っている場合、Safariがどんな問題を抱えているとは思われないよう、あなたの代わりにgeneral sibling selector ~を使用することができますそれに：あなたはh1次の複数のnavの要素を持っている場合は

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

jsFiddle preview

、あなたはを使用して、連続nav要素のため、手動でスタイルを上書きする必要があります。