2

私は現在、純粋なCSSマルチレベルドロップダウンメニューに取り組んでおり、ドロップダウンを親メニューの左側に自動的に揃える方法を一生理解できません。

ここにスクリーンショットがあります

クリックしてドロップダウンのスクリーンショットを表示

ここにCSSがあります

/*---------HEADER MENU---------*/
#header .content ul.menu li ul{
  display: none;
  margin: 0;
  float: left;
  padding: 0;
  position: absolute;
  z-index: 200;
}
#header .content ul.menu li ul li{
 position: relative;
 top: 20px;
 margin: 0;
}
#header .content ul.menu li:hover > ul{
 display: inline;
 float: left;
 width: 125px;
}

#header .content ul.menu li ul li li{
 width: 125px;
 float: left;
 position: absolute;}

/*---------VISITORS MENU---------*/
#block-menu-menu-visitors .content ul.menu{
  z-index: 200;
}
#block-menu-menu-visitors .content ul.menu li{
 padding: 2px 15px 2px 15px;
 display: inline-block;
 float: left;
 background-color: #ffff90;
}

#block-menu-menu-visitors .content ul.menu li:hover{
 padding: 2px 15px 2px 15px;
 float: left;
 display: inline-block;
 background-color: #ffffaa;
}

ここにHTML/PHPがあります

これにより、私が持っている「ヘッダー」要素（この場合はメニュー）がメインメニューセクションのすぐ下に配置されます。

正しい方向への助けやプッシュは役に立ちます！ありがとうございました

4

2 に答える 2

3

おもう...

#header .content ul.menu li:hover > ul{
display: block;
float: left;
width: 125px;
}

動作する可能性があります。html を追加しない場合は、正しい答えを提供できます。ベン。

于 2012-07-02T14:57:29.913 に答える
0

list-style-type: none;これらの要素の自然なインデントが削除されるため、リスト項目に追加することから始めます。

于 2012-07-02T14:22:10.390 に答える