-2

次のコードを使用して、サイドバーとコンテンツ領域を作成しました。

.container {
  overflow: hidden;
}

aside {
  width: 185px;
  background: lightgreen;
  float:left;
  padding:5px;
}

.content {
  background:lightblue;
  padding:5px;
  margin-left: 195px;
}

そしてHTML

<div class="container">
  <aside>  
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>  
  </aside>

  <div class="content">   
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>  
  </div>

</div>

できます。ただし、サイドバーの高さはコンテンツ領域のみに制限されています。コンテンツがない場合でも、サイドバーにフルハイトで背景色を付けるにはどうすればよいですか？

http://jsfiddle.net/mLVBE/

4

2 に答える 2

2

基本的に、html、body、container、および脇に高さを100％追加します。

これがあなたのための更新されたフィドルです：

http://jsfiddle.net/mLVBE/3/

于 2012-10-11T15:03:14.973 に答える
2

フロートには注意が必要な副作用があります。

これが私が絶対測位を使用したデモです：

http://jsfiddle.net/mLVBE/5/

于 2012-10-11T15:07:23.443 に答える