如何为 Bootstrap 手风琴设置最大高度

Question

我使用 this 模板在 Bootstrap 中创建了手风琴。

我可能会有更多的元素，并且无法弄清楚如何在子链接的内容 div 变得可滚动之前设置菜单的最大高度，因为我有一个有限的 window.

我已经尝试将最大高度应用于 #menu 和 .list-group.panel

Answer 1

一个项目是 38px 所以你可以设置一个 max-height 到 .sublinks div 到你想要显示的 divs 的数量所以如果你想要两个使它成为 76px 或者你想要 3 使它成为 114px 等等。我还添加了 overflow: overlay; 这样你就不会看到手风琴位之外的项目它仍然添加了一个滚动条。

Jsfiddle

Answer 2

这是一个示例，说明如何使用您提供的代码进行滚动。

div.sublinks.collapse {
    max-height: 200px;
    overflow-y: scroll;
}

http://jsfiddle.net/bjpLL5xn/3/

您将运行遇到的问题是，展开时 Javascript 将制作动画 "jump"。

Answer 3

.panel-group .panel+.panel {
margin-top: 3px !important;
max-height: 90% !important; //90% height of your parent div and if it crosses y-axis scroller will be shown 
overflow-y: auto !important;
}

始终使用 % 而不是 px...稍后您将遇到分辨率问题。

如何为 Bootstrap 手风琴设置最大高度

How to set max height for Bootstrap accordion

html

javascript

css

twitter-bootstrap

electron