1

HTML ページのテキストがメニュー内で折りたたまれている理由がわかりません。ここでjsfidleでページを見つけることができます。

私のHTMLファイルの一部：

<div class="menu">
    item 1
    item 2
    ...
</div>
<div class="content">
    text text text
</div>

私のCSSファイルの一部:

.menu{
float: left;
padding-top: 100px;
width: 20%;
position: relative;
}
.content{
float: right;
padding-top: 100px;
width: 80%;
color: #dddddd;
position: relative;
}

幅%のcssの問題ですか? または、他の何か？

4

3 に答える 3

2

定義.menuし.contentているのは20%、ウィンドウ80%の幅です。コンテナのサイズは適切です。

ただし、ノードに幅150pxとパディングを設定しているため30px、.grezzoノードはdivの外側に拡張されます.menu（ウィンドウが小さすぎる場合）

上の幅を削除してみてください.grezzo

于 2013-01-20T21:42:31.780 に答える
0

これは、左の div にコンテナーよりも突き出たコンテンツがあるためです。したがって、テキスト (右) div は、本来あるべきように実際には左の div に対して真上にありますが、ボタンは左の div から伸びています。

これを解決するには、ボタン画像のサイズを変更するか、左側の div を自動的にサイズ変更してそれらを保持し、ここで説明されているように右側の div が残りのすべてのスペースを使用するようにする必要があります。

これがお役に立てば幸いです！

于 2013-01-20T21:47:25.623 に答える
0

float: left;メニュー要素から削除します。また、 と の を削除するwidthと.content、.menuテキストがメニューに重ならなくなります。

于 2013-01-20T21:51:09.303 に答える