Search code examples
javascriptcsstwitter-bootstrap-3mobile-safariios9

Screen zooms in when a Bootstrap modal is opened on iOS 9 Safari


When I open a Bootstrap 3 modal on iOS9 Safari, the screen zooms in. It is working as expected on the Chrome app on iPhone. Below are the pictures which show the issue.

Safari screenshot:

safari screenshot

Chrome screenshot(expected behavior):

chrome screenshot


Solution

  • The following code fixed the issue for me (and some other people -> see GitHub link):

    body {
      padding-right: 0px !important
    }
    
    .modal-open {
      overflow-y: auto;
    }
    

    Source: https://github.com/jschr/bootstrap-modal/issues/64#issuecomment-55794181