CSS HTML垂直自動調整大小和按需滾動

Question

所以這裏是我想要做的： 讓我們有一個固定大小的列。列的高度應占用父項的大小。

在列內我有兩個垂直堆疊的div。它們的寬度都佔用列寬。第一個div的高度是固定的大小。然而第二個是可變的，從父母那裏拿走任何遺體。而且其內容是可變的。如果其內容很大，則會出現垂直滾動條。

我該如何使用HTML和CSS來做到這一點？

Here's a quick JSFiddle POC.

我的問題是，如果我設置的第二div的高度設置爲auto它將伸展其父之外。如果我將它設置爲100％，它將再次大於其父項。重要的是滾動條只出現在第二個div上，而不是主div本身。

感謝，

Answer 1

這裏是我會做什麼：

http://jsfiddle.net/Tfzhm/1/

添加position:relative到container div，使滾動div position:absolute。頂部應設置爲與第一個堆疊div的高度相同的像素值。最後，設置bottom:0px，以便它到達包含div的底線。