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的底线。