twitter-bootstrap Bootstrap 的可滚动标签内容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20553341/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Scrollable tab content with Bootstrap
提问by Graeme Pyle
Within a fixed-height container, I'd like to make the tab content scroll, leaving the tabs at the top.
在固定高度的容器中，我想让标签内容滚动，将标签留在顶部。
<div class="bs-example bs-example-tabs" style="height: 200px; border: 1px solid black">
<ul id="myTab" class="nav nav-tabs">
...
</ul>
<div id="myTabContent" class="tab-content">
This is long and must scroll, tabs must stay on top
....
</div>
</div>
See http://jsfiddle.net/graemian/Wxr9d/3/
见http://jsfiddle.net/graemian/Wxr9d/3/
I've found a solution using the flex layout:
我找到了一个使用 flex 布局的解决方案：
http://jsfiddle.net/graemian/wefPL/1/
http://jsfiddle.net/graemian/wefPL/1/
(Chrome-only), but surely there is another, simpler way?
（仅限 Chrome），但肯定还有另一种更简单的方法吗？
回答by Slawa Eremkin
You can emulate scroll with overflow:auto
您可以使用溢出模拟滚动：自动
.bs-example{
position: relative;
}
.tab-pane{
position: absolute;
top: 42px;
bottom: 0;
right: 0;
left: 0;
overflow:auto;
}
