1

ul div に問題があります。ul の親 div がそれを保持していません。親 div (subMenu) を配置して z インデックスを付けていますが、ul 子 (subMenu) は押し出され、その下部に表示されます。親に適用した位置まで引き上げます。フローティングとリストスタイルの配置を試みました。しかし、何も問題はないようです。CSSコードは次のとおりです。

#subMenu {
background-image: url(images/sub_nav_background2.png);
width: 1280px;
height: 60px;
position: relative;
top: -145px;
z-index: -100;
}

#subMen {
margin-left: 330px;
list-style-position: inside !important;
float: left !important;
height: 20px;
width: 900px !important;
font-size: 14px;

}

これを含む HTML セクションを次に示します。

<div id="subMenu">
        <ul id="subMen">
        <li><a href="#">BRAND MARKETING</a></li>
        <li><a href="#">EXPERIENTIAL MARKETING</a></li>
        <li><a href="#">PERFORMANCE SOLUTIONS</a></li>
        <li><a href="#">MEETING & EVENT SOLUTIONS</a></li>
        </ul>
        </div>
<div class="clearfix"></div>

そして、これが何が起こっているかのイメージです。

下部にリストされているメニューは、その灰色の領域にあり、上部のメイン ナビゲーションの下に隠れているはずです。

4

3 に答える 3

1

できるよ

list-style-position:inside;
于 2014-12-09T14:35:18.713 に答える
0

あなたのコードに基づいてフィドルをまとめました。

http://jsfiddle.net/wby6W/1/

#subMenu {
background:#ccc;
width: 1280px;
height: 60px;
position: relative;
z-index: -100;
overflow:hidden;
}

#subMen {
margin-left: 330px;
float: left;
width: 900px;
font-size: 14px;
}

ウィンドウ内にテキストを表示する必要があったため、top:-145px を削除しました。上で提案したように、overflow:hidden も CSS に追加しました。

于 2013-03-11T16:25:01.617 に答える
0

何かをフロートすると、その親 div をエスケープできます。overflowプロパティを親に追加する必要があります。指定overflow: hiddenすると、オーバーフローが非表示になります。overflow: scrollスクロールします。

作業例: http://jsfiddle.net/BZFTY/2/。

上記のフィドルで、オーバーフロー プロパティを別の値 ( default、scroll、および) に変更してみてくださいhidden。

于 2013-03-11T15:40:55.447 に答える