jquery - 垂直收缩 div 内容以适应一定高度

Question

我找不到实现以下内容的解决方案:假设我们有一个 div(垂直侧边栏)占据视口(viewport)的一定百分比宽度，比方说 20%。在这个 div 里面有一些东西，比如一个标志，一个树状菜单等等。我希望这个 div 具有浏览器视口(viewport)的高度(以使其固定)。这意味着在小分辨率的情况下，div 内容必须垂直收缩以适应较小的高度。我怎样才能做到这一点？你可以看看 http://lyk-ag-stefan.att.sch.gr/ . ▼蓝色侧边栏对应上面的描述。

我尝试了一些 JQuery。

$(document).ready(function () {
    sheight = $(window).height();
    $('.sidebar').css("max-height", sheight);
});

不幸的是，它没有用。

谢谢

Answer 1

div需要知道父容器的高度

CSS:

html,body{
    height: 100%;
}

.sidebar{
    border: 1px solid silver;
    width: 20%;
    height: 100%;
}