1

モバイル サイトとデスクトップ サイト用に 2 つの個別のメニューがあります。このネストされたメニューに非常に高い z-index を追加しましたが、それでも他の要素の背後に隠れており、上部に表示されません。では、これを他のすべての要素の上に配置するにはどうすればよいでしょうか。レイアウトのサンプルは次のとおりです。

<nav id="responsive_main_menu">
<div id="navigate-to">Navigate to</div>
                        <ul id="menu-main-menu-1" class="menu">
<li class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home alpha"><a href="#"><span>Home</span></a></li>
</ul>

CSSは次のとおりです。

#responsive_main_menu .menu,#responsive_main_menu .menu ul {

z-index: 999999;
}

この問題を示す URL は次のとおりです。ページを小さいバージョンにサイズ変更して、青いメニューを表示します。http://daccordinc.com/

4

3 に答える 3

3

static要素のスタック コンテキストを変更するには、デフォルト値以外の位置プロパティを適用する必要があります。以下のセレクターに相対位置を追加します。

#responsive_main_menu {
    position: relative;
    z-index: 999999;
}

http://img836.imageshack.us/img836/1389/wgyj.jpg

于 2013-08-16T15:11:32.747 に答える
2

z-indexposition宣言されていない場合は機能しません

私はそこに追加position: relative;し、今違いを見てください

ここに画像の説明を入力

于 2013-08-16T15:10:06.733 に答える
1

z-index動作するには(デフォルト) とはposition異なる必要があります。 試してみてください、うまくいきます：static
relative

#responsive_main_menu .menu, #responsive_main_menu .menu ul {
  z-index: 999999;
  position: relative;
}
于 2013-08-16T15:11:09.090 に答える