2
メニューナビゲーションにシンプルなCSS（javascriptなし）を使用するHTMLページを作成しました。私は、同じページにタブ付きのデータを表示するために、jQueryのUIタブを使用しています。ULメニューがBEHIND jQueryのUIタブと画像を表示しています
メニューがドロップダウンし、（実際には、メニューには、メニューが終わっ低下する上、テキスト内の任意の画像の背後に表示さjQueryのタブBEHIND表示されている
マイ（ベアボーン）HTMLは次のようになります。
<html>
<body>
<div>
<div id="navigation2">
<ul id="menu" style="margin-left:5px;">
<li class="navigable">
<a class="menuitem" href="#">Foo</a>
<ul class="submenu">
<li><a href="">Foo Bar 1</a></li>
<li><a href="">Foo Bar 2</a></li>
<li><a href="">Foo Bar 3</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div id ="tdisp">
<!-- jQuery tab display here ... -->
</div>
</body>
</html>
とCSSファイルのようになります。
#navigation2{
background-color: #2d2d2d;
color: #FFFFFF;
height: 35px;
list-style-type: none;
font-size: 15px;
}
#navigation2 ul li {
list-style-type: none;
padding: 7px 20px 7px 5px;
float: left;
}
#navigation2 a.menuitem, #navigation2 a.undecorated {
color: #CCCCCC;
text-decoration: none;
}
#navigation2 a.current{
color:#FF0000;
}
#navigation2 ul li.navigable:hover {
cursor: pointer;
color: #FFFFFF;
background-color: #535354;
border-bottom-color: #c00000;
border-bottom-width: 2px;
border-bottom-style: solid;
}
私はzオーダーで行うには、その何かを疑うが、私は確認していないとの専門家から話を聞くしたいと思いますここでこの問題を解決する方法について説明します。私がこれまでに受けてきた答えから
[[編集]]
、z-indexが犯人である表示されます。しかし、誰かが実際にこれを修正する方法の詳細をいくつか提供することができますか？ （私は実際にはC++の開発者なので、これは私には馴染みのない領域です）。
z-index属性をnavigation2を含むすべてのルールに追加するのか、それとも1つだけを追加するのですか？ - CSSファイルのルールエントリが1つだけ必要な場合は、Z-Indexを追加しますか？
FF FirebugまたはChrome開発ツールを使用してjQueryタブのZインデックスを確認するにはどうすればよいですか？私はテストのような大きなものにあなたのnavigation2要素上のz-index属性をぶつけてみます
'＃navigation2 { background-color：＃2d2d2d; 色：#FFFFFF; 身長：35px; list-style-type：なし; font-size：15px; z-インデックス：1000; } ' –
マイケルに感謝します。私はそれを働かせました（代わりに＃naviagtion2 ul liにZインデックスを追加しなければなりませんでした） –