Bootstrap 3面板移动滚动/响应

Question

这是我的问题：我试图实现一个带有用户列表的bootstrap 3面板。此列表位于另一个bootstrap 3面板中。 看这里： https://jsfiddle.net/gwnyyvaa/

ok some apparently some code is needed here

现在问题是在移动设备上，它不允许滚动。我希望它允许滚动，因为移动屏幕很小，可以在一个页面上显示它。

谢谢！

Answer 1

如果面板中显示的文本太多，则Bootstrap不会自动滚动面板。所以你应该添加一些CSS来自己做。以下是您需要添加的CSS：

.users_list .panel-body {
    overflow-x: auto;
}

如果文本溢出容器，这将导致.panel-body .user_list水平滚动。

以上是添加了上述CSS的小提琴： https://jsfiddle.net/89cpmctt/1/

如果您希望它垂直滚动，则必须为面板指定高度。这是因为div将垂直扩展以适合内容。因此，您需要向height添加.panel-body属性。与overflow-y:auto一起。这是一个例子

.panel-body {
    height: 500px;
    overflow-y: auto;
}