fix .modal-dialog-centered on IE10/11

twbs · Jul 21, 2018 · 6cca02f · 6cca02f
1 parent c04d60b
commit 6cca02f
Showing 1 changed file with 12 additions and 0 deletions.
diff --git a/scss/_modal.scss b/scss/_modal.scss
@@ -54,6 +54,13 @@
   display: flex;
   align-items: center;
   min-height: calc(100% - (#{$modal-dialog-margin} * 2));
+
+  // Ensure `modal-dialog-centered` extends the full height of the view (IE10/11)
+  &::before {
+    display: block; // IE10
+    height: calc(100vh - (#{$modal-dialog-margin} * 2));
+    content: "";
+  }
 }
 
 // Actual modal
@@ -153,6 +160,11 @@
 
   .modal-dialog-centered {
     min-height: calc(100% - (#{$modal-dialog-margin-y-sm-up} * 2));
+
+    &::before {
+      height: calc(100vh - (#{$modal-dialog-margin-y-sm-up} * 2));
+    }
+
   }
 
   .modal-content {