DIV:全高+滚动

我希望有一个DIV:

高度=所有availbale大小

垂直滚动我的内容

我可以做1)或2),但这两个要求对我来说都不正常.

他是我的HTML:

  

     ...
  

这是CSS:

.FixedHeightContainer
{   
    height: 100%;   
    padding:3px; 
    background:#f00;
}
.Content
{
    height: 100%;
    overflow:auto;
    background:#fff;
}

这是jsfiddle:https://jsfiddle.net/demas/9jLayt3v/

在此版本中,内容大于可用高度(查看底部的红色边框).

我可以设置height = 300px,在这种情况下,我将拥有正确工作的滚动,但内容的高度对于所有屏幕尺寸都是相同的.

如何使Content.Height =所有可用的大小和Scroll for it内容？

或者换句话说:我需要让红色边框等于浏览器大小并在红色边框内滚动

别忘了视口.

在您的示例中,我刚刚添加了以下行:

html, body { height: 100%; }