1

内部コンテンツ ( 、その他の など) が変更divされたときに、CSS で設定されていない高さを変更しないという問題があります。uldiv

私のhtmlコード:

<div id="main_wrapper"> 
    <div id="navigation"> 
        <ul>
            <li><a href="#"> link one </a></li> 
            <li><a href="#"> link two </a></li> 
            <li><a href="#"> link three </a></li> 
            <li><a href="#"> link four </a></li> 
        </ul> 
    </div> 
</div> 

私のCSSコード:

#main_wrapper { 
  display: block;
  border:1px solid black; 
} 
#navigation { 
  background-color: rgba(0, 0, 0, 0.4); 
  position: relative;  
  padding: 8px; 
  float: right; 
} 

ここでデモ

4

2 に答える 2

2

に追加overflow: auto;#main_wrapperます。

于 2013-09-26T19:32:36.620 に答える
1

divが内部の要素の高さを取得していない理由は、浮動要素を表示する際の癖に関係しています。スタイルとして#navigation要素の後に空の要素を追加すると、フロート要素の高さに合わせます。clear: both;#main_wrapper

display: inline-block;または、ラッパーに追加することもできdivますが、幅 ( width: 100%;) も指定する必要があります。clearfix を使用することをお勧めします。

デモ: http://jsfiddle.net/NXNDV/4/

于 2013-09-26T19:38:26.357 に答える