0

ナビゲーションメニューの基本は、margin:auto;を使用して中央に配置された#navdiv内に残っている3つのdivをフローティングすることによって設定されています。

これらのナビゲーションメニューオプションの1つだけが、ドロップダウンメニューを必要とします。ドロップダウンメニューを通常のフローから外して、他のフロートオブジェクトが移動しないようにする必要があると想定しています。

これは私の最初のプロジェクトなので、このメニューの配置方法に頭を悩ませようとしています。ピクセル値を基準にして位置を調整すると、ユーザーの画面サイズ/解像度によっては、メニューが元のリンクの下に表示されない場合があります。

赤いXは、ドロップダウンが表示される場所を示します。

この順序付けされていないものはポートフォリオリストアイテムの下にネストする必要がありますか、それともポートフォリオリンクの下に何らかの形で配置された別の順序付けされていないリストにする必要がありますか?ネストされていると、下の境界線が倒れるのではないかと心配しています。

コードを投稿することはできますが、ここからどこから始めればよいのか途方に暮れています。正しい方向へのプッシュを探しています!

ありがとう

これまでの設計

4

1 に答える 1

3

これは通常、次のように行われます。

<ul class=menu id=leftLinks>
    <li>about</li>
    <li>portfolio
        <ul class=submenu>
            <li>Submenu item</li>
        </ul>
</li>
</ul>


.menu > li {
    position: relative;
}

.submenu {
    position: absolute;
    left: 0;
    top: 100%;
}
于 2012-12-20T15:38:15.777 に答える