全高固定侧边栏，滚动部分

Question

我正在尝试使用可折叠部分创建固定侧栏导航。我有很多菜单项，我不希望整个侧边栏在没有足够的空间高度时滚动（如here所示），而是我试图将每个可折叠部分设置为{ {1}}以便它们可以独立滚动。

This fiddle显示了这个概念，但它将每个部分限制为200px - 我想要的是而不是在可用空间时滚动。

这是我正在使用的CSS：

overflow:auto

HTML：

.nav_wrapper {
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 250px;
    margin-left: -250px;
    width: 250px;
    overflow: hidden;
}

.nav_panel {
  overflow: auto;
  max-height: 200px;
}

我尝试在`.nav_panel'上添加<div class="nav_wrapper"> <div class="nav_sidebar"> <!--start menu item 1--> <div class="nav_menuItem" data-toggle="collapsed"> <div class="nav_label"> Menu Label 1 </div> <div class="nav_panel"> <ul> <li>Item One</li> ... </ul> </div> </div> </div> </div> ，如下所示：

height: 100%

但这导致该部分的高度大于其父级的100％。

我已经看到使用弹性框实现了这一点（参见示例here），但我需要支持IE9 - 是否有其他方法可以实现这一目标？