Bootstrap 3 modal vertical position center


How can you position the modal vertically in the center when you don't know the exact height of the modal?



Vertically Center

Vertically center your modals without declaring a height.

Use this code for verticle modal in center

.modal {
  text-align: center;
  padding: 0!important;

.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;


  • answered 1 year ago
  • Community  wiki

Your Answer

    Facebook Share