user3198259
user3198259

Reputation: 174

Bootstrap4 modal is not working on mobile and tablet

Modal is not working on mobile and tablet. I am using bootstrap4 modal in angular7.

Below is the code which i used to open a modal. Below code used in app.component.html to open a modal. Please help.

<div class="row">

  <div class="col-12 cancel-exit-block">

    <li><a href="#" onclick="void(0)" data-toggle="modal" data-target="#openAllowModal">Modal</a></li>
  </div>
</div>

<div class="modal fade" id="openAllowModal" role="dialog">
  <p>open modal</p>
</div>

Upvotes: 0

Views: 3430

Answers (1)

Luca Spezzano
Luca Spezzano

Reputation: 380

To open a bootstrap modal you always need a div with the class modal-dialog and a div with the class modal-content You can give a look to some example here: https://getbootstrap.com/docs/4.0/components/modal/

So try to transform your last div

<div class="modal fade" id="openAllowModal" role="dialog">
  <p>open modal</p>
</div>

to this

<div class="modal fade" id="openAllowModal" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <p>open modal</p>
    </div>
  </div>
</div> 

Upvotes: 1

Related Questions