1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-09 07:06:36 +02:00

Fix modal overflow style nesting (#26742)

Nest `.modal` styling directly under `.modal-open`
to avoid issues when bootstrap is nested.
This commit is contained in:
Joshua David
2018-06-22 14:13:44 +10:00
committed by Mark Otto
parent 23e4d48e65
commit c04d60b88f

View File

@@ -4,9 +4,14 @@
// .modal-content - actual modal w/ bg and corners and stuff // .modal-content - actual modal w/ bg and corners and stuff
// Kill the scroll on the body
.modal-open { .modal-open {
// Kill the scroll on the body
overflow: hidden; overflow: hidden;
.modal {
overflow-x: hidden;
overflow-y: auto;
}
} }
// Container that the modal scrolls within // Container that the modal scrolls within
@@ -25,11 +30,6 @@
// We deliberately don't use `-webkit-overflow-scrolling: touch;` due to a // We deliberately don't use `-webkit-overflow-scrolling: touch;` due to a
// gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342 // gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342
// See also https://github.com/twbs/bootstrap/issues/17695 // See also https://github.com/twbs/bootstrap/issues/17695
.modal-open & {
overflow-x: hidden;
overflow-y: auto;
}
} }
// Shell div to position the modal with bottom padding // Shell div to position the modal with bottom padding