0

ヘッダーに続いて左側にサイドバーがあり、右側にメインコンテンツ領域があるページがあります。右側のメイン コンテンツ エリアを、左側のサイド バーとは別にスクロールできるようにしたいと考えています。

-----------------------------------
| Header                          |
|---------------------------------|
|         |                       |
|         |                       |
| Left    | Main                  |
| Sidebar | Content               |
|         |                       |
|         |                       |
-----------------------------------

でメイン コンテンツのスタイルを設定できることはわかっていますが{ height: 500px; overflow-y: auto; }、設定した高さがウィンドウの残りの高さと常に一致するとは限りません。

これを達成し、メイン コンテンツで利用可能なすべてのウィンドウ スペースを通常どおり使用する方法はありますか?

4

1 に答える 1

2

絶対配置で作成できます。そこを参照してください：http://jsfiddle.net/KpJgd/

#content{
    position:absolute;
    top:200px;
    right:0;
    bottom:0; /*this is the trick where the <div> goes til the bottom of the window*/
    width:70%;    
    overflow:auto;
    background-color:#008800;        
}

CSS で指定する必要があることに注意してください。

html, body{
    width:100%;
    height:100%;
    overflow:hidden;
}
于 2013-03-21T20:50:56.123 に答える