这个问题似乎在github上被问了很多次,但我还没有找到任何解决方案:https://github.com/twitter/bootstrap/issues/1399
如何在小屏幕上正确地垂直对齐模态?
编辑:从引导程序2.0.2开始,这不再是一个问题。基本上,bootstrap现在实现了下面提出的解决方案,我将把它留在这里供参考
通常,在小屏幕上,模态会填满你的大部分窗口,所以相对于触发模态的按钮定位没有太大意义。我通常所做的只是覆盖手机的模式位置:
@media (max-width: 767px) {
.modal {
top: 20px;
// negative left margin to position horizontally.
margin: 0 0 0 -280px;
// already in modals.less, just copied for clarification:
left: 50%;
position: fixed;
}
}
(这是在LESS中,纯CSS解决方案看起来很相似)。