2016-07-30 15 views
1

私はこのような状況に陥っています。私はメニューのナビゲーションバーを持っていますが、私がページに表示すると、別のdivが私の固定メニューのnavbarをカバーします。他のdivのnavbarメニューを最初に表示するには?

<?php  
     if (wp_is_mobile()) 
     { 
      echo <<<START 
      <div class="navbar"> 
       <center> 
        <a href="javascript:history.back()"><i class="pfadmicon-glyph-255"></i>Back &nbsp;</a> 
        <a href="http://tradeordeal.com/dashboard/?ua=profile"><i class="pfadmicon-glyph-252"></i>Profile &nbsp;</a> 
        <a href="www.#.com"><i class="pfadmicon-glyph-221"></i>Messages &nbsp;</a> 
        <a href="http://tradeordeal.com/dashboard/?ua=newitem"><i class="pfadmicon-glyph-66"></i>Post an Ad &nbsp;</a> 
       </center> 
       </div> 
START; 
} 
?> 

とCSS:最初の画像で

.navbar{ 
    height: 4em; 
    width: 100%; 
    background: #2c3e50; 
    font-size: 15px; 
    padding-top: 20px; 
    color: white; 
    position: fixed; 
    top: 100%; 
    margin-top: -4em; 
} 

私は下の位置に固定メニューのナビゲーションバーを持っていますが、私はスクロールするとき、それは別のdivまたは画像によって覆われている私のメニューナビゲーションバーは次のようです。どうしてか分かりません。私はワードプレスの私のテーマを持っている:

enter image description here

enter image description here

私が最初に私のナビゲーションバーを表示したいです。ありがとう

答えて

1

あなたが提供したコードはうまくいくようです。 画像や投稿のCSSスタイルに問題があるようです。

は、以下のコードを実行してみましょう:

.something { 
 
    
 
} 
 

 
.navbar{ 
 
    height: 4em; 
 
    width: 100%; 
 
    background: #2c3e50; 
 
    font-size: 15px; 
 
    padding-top: 20px; 
 
    color: white; 
 
    position: fixed; 
 
    top: 100%; 
 
    margin-top: -4em; 
 
}
<div class="something"> 
 
<h1><center>Scroll down</center></h1> 
 
<img src="http://i.stack.imgur.com/DrOyP.jpg"> 
 
</div> 
 

 
<div class="navbar"> 
 
       <center> 
 
        <a href="javascript:history.back()"><i class="pfadmicon-glyph-255"></i>Back &nbsp;</a> 
 
        <a href="http://tradeordeal.com/dashboard/?ua=profile"><i class="pfadmicon-glyph-252"></i>Profile &nbsp;</a> 
 
        <a href="www.#.com"><i class="pfadmicon-glyph-221"></i>Messages &nbsp;</a> 
 
        <a href="http://tradeordeal.com/dashboard/?ua=newitem"><i class="pfadmicon-glyph-66"></i>Post an Ad &nbsp;</a> 
 
       </center> 
 
       </div>

・ホープ、このことができます。 :)

関連する問題