1

div 内にメニュー コントロールがあります。最初に、ブラウザの幅と同じにするために、div 幅を 100% に、最小幅を 1200px に設定しました。メニューの項目数は、要件に応じて今後増加する可能性があります。メニューの項目を増やしてブラウザの動作をテストしました。ここでは、最後の項目が下がっています。ここで期待しているのは、div の幅が大きくなったときにブラウザーが水平バーを提供する必要があるため、メニュー内のすべての項目が 1 行に表示されることです。

CSS コード:

.maindiv{ position: relative;width: auto !important;width: 100%;min-width: 1200px;}

私のメニュー構造は

<div class="maindiv" >
   <ul><li></li></ul>
</div>
4

1 に答える 1

1

以下のCSSが必要です

.maindiv { 
    position: relative;
    width: 100%; 
    min-width: 1200px;
    overflow: auto;
    white-space: nowrap;
}

リスト項目がインラインまたはインラインブロックとして表示されていると仮定しています...

.maindiv li {
    display: inline-block;
}

そして、私の最後のアドバイスは、あなたは本当に欲しいですmin-widthか?人々がブラウザのサイズをこれより下に変更すると、ブラウザウィンドウに水平スクロールバーが表示され、項目が収まらない場合はdivにスクロールバーが表示されます.

于 2012-05-17T10:14:07.980 に答える