Bootstrap Modals not working in small devices / screens
-
Hi there!
It looks like Bootstrap modals have a weird behaviour when loaded from small devices. I tried to use the following piece of code:<!-- Button trigger modal --> <a class="btn btn-primary btn-lg" href="#myModal1" data-toggle="modal">Launch demo modal</a> <!-- Modal --> <div id="myModal1" class="modal fade" tabindex="-1"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button class="close" type="button" data-dismiss="modal">×</button> <h4 class="modal-title">Get to the Front of The Queue</h4> </div> <div class="modal-body">...</div> <div class="modal-footer"><button class="btn btn-default" type="button" data-dismiss="modal">Close</button> <button class="btn btn-primary" type="button">Save changes</button></div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->
It works and looks OK on a PC, but in small devices, the darker area (I think it’s called backdrop) stays over the modal, so it can’t be closed and the whole page stays grey. Trying the same piece of code with other WP themes using Bootstrap, works fine.
Could it be somehow a bug in the theme or am I missing something?
Thanks in advance for your help!
Viewing 3 replies - 1 through 3 (of 3 total)
Viewing 3 replies - 1 through 3 (of 3 total)
- The topic ‘Bootstrap Modals not working in small devices / screens’ is closed to new replies.