How to center a modal window on a page?

Question

I am trying center a modal window in the browser page. I just want to center it, so that it should be responsive for all the screens.

Answer 1

Tried almost all CSS options, but finally something worked : jQuery

setInterval(function()
     {
         if($('#myModal').is(':visible')===true)
         {
             $("body").addClass("modal-open");
             $('#myModal').css({"display":"flex"});
         }
         else
         {
             $("body").removeClass("modal-open");
             $('#myModal').css({"display":"none"});
         }

     },200);

This is basic bug from Bootstrap regarding the adding/removal of class modal-open to the body tag which is being discussed over the years but no working solution till date.