css – Twitter引导可滚动模态

前端之家收集整理的这篇文章主要介绍了css – Twitter引导可滚动模态前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用twitter启动我的项目。

我有一个模态窗口有一个稍长的形式,我不喜欢,当窗口太小时,模态没有滚动(如果刚刚消失了我的页面是不可滚动的)。

解决这个问题,我使用了以下css

.modal {
    overflow-y:auto;
    max-height:90%;
    margin-top:-45%;
}

这正是我想要的在Chrome中的方式(即,窗体是全尺寸,当窗口足够大,但随着窗口收缩模态收缩和变得可滚动)。问题是在IE中模态是关闭屏幕。有没有人有更好的解决这个问题?

我的示例可以在tinyhousemap.com中找到(点击导航窗口中的“向地图添加条目”以显示模态)

谢谢

解决方法

下面的解决方案怎么样?它为我工作。尝试这个:
.modal .modal-body {
    max-height: 420px;
    overflow-y: auto;
}

细节:

> remove overflow-y:auto;或overflow:auto;从.modal类(重要)
> remove max-height:400px;从.modal类(重要)
> Add max-height:400px;到.modal .modal-body(或者什么,可以是420px或更小,但不会超过450px)
>添加overflow-y:auto;到.modal .modal-body

完成后,只有主体会滚动。

猜你在找的CSS相关文章