From fd7f77711e06c5fa0b8cfb70e6d56e57b5273b7b Mon Sep 17 00:00:00 2001 From: Ahmed Abdelaziz Date: Sun, 12 Jan 2020 13:17:48 +0200 Subject: [PATCH] Update _modal.scss 1- Fix ".modal-dialog-centered" class in mobile browsers as its not exactly centered because the browser add the height of "::before" to the content. 2- Remove ".modal {overflow-x: hidden;overflow-y: auto;}" it makes the modal content scrollable in mobile browsers if you tried to drag it. --- scss/_modal.scss | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/scss/_modal.scss b/scss/_modal.scss index 421e3e640086..6d8a87d96c00 100644 --- a/scss/_modal.scss +++ b/scss/_modal.scss @@ -7,11 +7,6 @@ .modal-open { // Kill the scroll on the body overflow: hidden; - - .modal { - overflow-x: hidden; - overflow-y: auto; - } } // Container that the modal scrolls within @@ -80,10 +75,12 @@ min-height: subtract(100%, $modal-dialog-margin * 2); // Ensure `modal-dialog-centered` extends the full height of the view (IE10/11) - &::before { - display: block; // IE10 - height: subtract(100vh, $modal-dialog-margin * 2); - content: ""; + @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { + &::before { + display: block; // IE10 + height: subtract(100vh, $modal-dialog-margin * 2); + content: ""; + } } // Ensure `.modal-body` shows scrollbar (IE10/11)