如何让Twitter Bootstrap模态页脚在小屏幕上始终可见?

时间:2013-11-15 17:34:22

标签: twitter-bootstrap mobile responsive-design modal-dialog

使用Twitter Bootstrap 2.3.1,即使在较小的屏幕上,也需要进行哪些更改才能强制显示页脚(及其内容!)?我希望在这些较小的屏幕上,modal-headermodal-footer中的内容将始终显示,每个内容完全显示,只有modal-body的内容可滚动。 modal-header目前似乎采用了这种方式,但是modal-footer的大小调整到了非常小的垂直高度屏幕上,页脚甚至不再可见。

在这个示例中,您可以看到包含大量modal-body内容的内容,非常小屏幕上的modal-footer被截断,我希望其中的按钮可以完整显示,如在第二个部分例子中那样。

Modal with truncated footer (actual behavior)

Modal with full footer (expected behavior)

1 个答案:

答案 0 :(得分:0)

.modal-body类默认为max-height: 400px。您可以在另一个CSS文件中覆盖(或编辑Bootstrap LESS文件)为较小的值,或者根据窗口高度在页面加载和调整大小时通过javascript设置此值。