There is a problem of displaying a modal window created using the bootstrap framework in mobile browsers.

That is, in browsers on computers, the display of modal windows is correct, but, in mobile versions of the browser, a block appears on top of the modal window, blocking all access to the site.

Track that it does not work as there is no possibility to view the markup in the phone (or I have not yet found a way).

What could be the problem and where can I test the work of sites for phones (namely, phones, and not to check the adaptability of the layout)?

  • one
    You can test in the google chrome browser 100%. Developer mode -> phone icon and device selection (orienting there). And it is advisable to provide the code so that the respondents can more easily answer your question - Ep1demic
  • The site itself is in an unfinished state at the address of rehabilitation.by - Denis Danilov
  • Another feature is that the modal window works fine on a laptop simulator, but does not work on phones. - Denis Danilov
  • the window that closes everything around is a div with a "modal-backdrop fade in" class - Ep1demic
  • Try media queries to remove this window on mobile devices. - Ep1demic

1 answer 1

On your site in the mobile version closes the entire block window:

<div class="modal-backdrop fade in"></div>

Why is this happening - it is not clear, in all the code to climb is not a hunt.

You can fight this trail. in the following way:
1) Delete this block altogether;)
2) Add media-queries query, where the window will be on the mobile version

  display:none
  • Thank you all for your participation. The main problem was the definition of tools for testing the site on mobile platforms. And the solution, as always, is simple and nearby. - Denis Danilov