パーセンテージオフセットで相対div内にfixed divを表示する[SAFARI bug]

Question

BootstrapとSafariで問題が発生しました。

私は固定されたdivをその親に対して配置したいと思っています。それはSafariを除くすべてのブラウザで動作します。

同じ問題がここで説明されています https://github.com/lionheart/openradar-mirror/issues/147

は今、私は良い回避策を見つけることを試みる：

オリジナルコード（Safariでは動作しません）

<div class="row"> 
    <div class="col-md-8 col-md-push-4"> 
     <div class="fixed-div">SOME FIXED CONTENT</div> 
     CONTENT A 
    </div> 
    <div class="col-md-4 col-md-pull-8"> 
     CONTENT B 
    </div> 
</div> 

CSS：

.fixed-div{ 
    position:fixed; 
} 

これはexとしては機能しませんSafariで告発された"fixed-div"は親のように "プッシュ"されません。 「コンテンツA」の上に表示されます。

私は解決策を見つけたが、私は、これはクリーンなものではないと思う：

<div class="row"> 
    <div class="col-md-4"> 
    </div> 
    <div class="col-md-8"> 
     <div class="fixed-div">SOME FIXED CONTENT</div> 
    </div> 
    <div class="clearfix"></div> 

    <div class="col-md-8 col-md-push-4"> 
     CONTENT A 
    </div> 
    <div class="col-md-4 col-md-pull-8"> 
     CONTENT B 
    </div> 
</div> 

あなたはこの問題を解決する方法をいくつかのより良いアイデアを持っていますか？

Answer 1

fixedからabsoluteにCSSプロパティに切り替えてみてください。それでも問題が解決しない場合は、HTML内でカスタムチェックを追加して、ユーザーがどのブラウザから来ているかを確認し、その特定のCSSページHow to use different CSS for Different Browsersを読み込むことができます。