css z-index がどのように設定されても、下部の li は常に上位層によってカバーされます。

マウスを「リリース年月」に移動すると、1996 年から 2013 年までの年が表示されます。
上の図に示すように、月の li が表示されます。年に移動すると、次のレイヤーでカバーされますが、対応するレイヤーのz-indexとposition属性を設定しましたが、それでも機能しません。

#navigation {z-index:10;position:relative;}
#navigation li {z-index:20;position:relative;background:blue;}
#navigation li ul{z-index:30;}
#navigation li ul li{z-index:40;position:relative;background:red;}
#navigation li ul li ul{z-index:255;position:absolute;}
#navigation li ul li ul li{background :#def2db;z-index:300;position:relative;background:green;}
#navigation li ul li ul li a{z-index:350;position:relative;}
========= =====
これは CSS コードの一部です。添付ファイルにある特定のテスト ファイルが原因です。午前中ずっと検索していましたが、まだ原因がわかりません。皆さん、ありがとうございます
クリックしてダウンロード

ディスカッションに返信（解決策）

これは何もおかしなことではありません
父と息子の関係の問題です

あなたに何か問題があるとも言えます

構造が間違っているので、構造を再調整する必要があります

必要なのは、水平 3 レベルのドロップダウン メニューを作成することだけです

それを行う前に、まずそれらの上下関係 (カバレッジ関係) を理解する必要があります

理解していると思います上下の関係はすでにわかっているので、次のコードを使用して、対応する z-index 値を設定します
#navigation {z-index:10;position:relative;}
#navigation li {z-index:20;position:相対;背景:青;}
#navigation li ul{ z-index:30;}
#navigation li ul li{z-index:40;position:relative;background:red;}
#navigation li ul li ul{ z-index:255;position:absolute;}
# ナビゲーション li ul li ul li{background:#def2db;z-index:300;position:relative;background:green;}

#navigation li ul li ul li a{ z-index:350;position:relative;}

はい、まだ想像通りに表示できません。何が問題だったのかわかりません。

問題は解決しました。ポイントを取得しましょう。

ポイントを受け取ります。問題の内容とその解決方法を説明してください

ポイントを受け取りに来ました。

これは、相対と絶対を使用して実行できます。最初のレイヤーは相対位置を使用し、2 番目のレイヤーは絶対を使用します。