bootstrap and bootbox: set dialog box center of the screen
Modal is already centered in horizontal direction. If you want vertical centered modal, hope this will work for you
bootbox.alert('Danger!!' ).find('.modal-content').css({
'background-color': '#f99',
'font-weight' : 'bold',
'color': '#F00',
'font-size': '2em',
'margin-top': function (){
var w = $( window ).height();
var b = $(".modal-dialog").height();
// should not be (w-h)/2
var h = (w-b)/2;
return h+"px";
}
});
Giving this answer according to your example.
If you want a vertical centered bootbox modal via css3
.modal-open .modal {
display: flex !important;
align-items: center;
justify-content: center;
}
You can have more flexibility here: https://www.kirupa.com/html5/centering_vertically_horizontally.htm https://css-tricks.com/snippets/css/a-guide-to-flexbox/
This question is quite old, but another short option would be to use the corresponding bootstrap class:
bootbox.alert('Danger!!')
.find(".modal-dialog")
.addClass("modal-dialog-centered");
This works with Bootstrap v4.0.0 or higher.
As of Bootbox 5, you can actually enable this via an option, centerVertical:
bootbox.alert({
message: "I'm a vertically-centered dialog!",
centerVertical: true
});