html - 如何垂直居中 Twitter Bootstrap 3 模态?

标签 html css twitter-bootstrap modal-dialog vertical-alignment

我一直在尝试将 Bootstrap 3 模态对话框垂直居中,但没有成功。如何实现?

最佳答案

您可以像这样在 Bootstrap 3 模态上实现垂直居中:

.modal-vertical-centered {
transform: translate(0, 50%) !important;
-ms-transform: translate(0, 50%) !important; /* IE 9 */
-webkit-transform: translate(0, 50%) !important; /* Safari and Chrome */
}

并将此 css 类添加到“modal-dialog”容器

<div class="modal-dialog modal-vertical-centered">
...

jsFiddle 工作示例:http://jsfiddle.net/U4NRx/

关于html - 如何垂直居中 Twitter Bootstrap 3 模态?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19041701/

相关文章:

javascript - 与 Bootstrap 按钮关联的 jQuery 函数仅执行一次

html - 使用 Nokogiri 和 Mechanize 解析 html 表

javascript - jquery 不会将类添加到 html 标记

javascript - jquery将数据发布到jsp页面的问题

javascript - 限制在一个div内拖动,在受限的div内限制一定高度?

javascript - 使用 javascript 根据图像的布局方向向图像添加不同的类名?

css - 页脚样式问题

html - 如何在 jquery 移动页面上垂直居中 DIV

jquery - 模态与另一个模态导致 body 滚动

javascript - Bootstrap 选择菜单 - 添加新选项