twitter-bootstrap 如何垂直居中 Twitter Bootstrap 3 模式？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19041701/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to vertical-center Twitter Bootstrap 3 modal?
提问by Rui
I've been trying to vertical center the Boostrap 3 modal dialog without sucess. How can that be accomplished?
我一直在尝试将 Boostrap 3 模式对话框垂直居中，但没有成功。怎么能做到呢？
回答by EGurelli
You can achieve vertical alignment center on Bootstrap 3 modal like that :
您可以像这样在 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 */
}
and add this css class to the "modal-dialog" container
并将这个 css 类添加到“modal-dialog”容器中
<div class="modal-dialog modal-vertical-centered">
...
jsFiddle working example : http://jsfiddle.net/U4NRx/
jsFiddle 工作示例：http: //jsfiddle.net/U4NRx/
回答by haisen
<style>
.modal-vertical-centered {
display: flex;
align-items: center;
}
</style>
<div class="modal fade modal-vertical-centered" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
