Menu
I've been trying to vertical center the Boostrap 3 modal dialog without sucess. How can that be accomplished?
595
Thanks v.d for pointing out you need to add both . modal-dialog-centered to . modal-dialog to vertically center the modal. This is the best answer for bootstrap 4.
Another way to vertically center is to use my-auto . This will center the element within its container. For example, h-100 makes the row full height, and my-auto will vertically center the col-sm-12 column. Since Bootstrap 4 .
You can achieve vertical alignment center on Bootstrap 3 modal like that :
.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
<div class="modal-dialog modal-vertical-centered">
...
jsFiddle working example : http://jsfiddle.net/U4NRx/
114
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
