Bootstrap 3 modal in mozilla не отображается

Question

Привет, ребята, я использую bootstrap v3.3.7, и теперь я сделал bootstrap modal, теперь все отлично работает на хроме и сафари, но по какой-то причине оно не работает на mozilla. Когда я нажимаю модальную кнопку в мозилле, ничего не происходит. Это мой код:

<button type="button" class="btn btn-lg accountBtn"> 
    <a href="#modal1" data-toggle="modal">Account details</a> 
</button> 

<div class="modal fade" id="modal1" role="dialog" style="display: none;"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header text-center"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
        <span aria-hidden="true">&times;</span> 
       </button> 
       <h2>Header h2</h2> 
       <h3>Header h3</h3> 
       <ul class="characteristicsList"> 
        Characteristics: 
        <li><img src="images/modal1.png" alt="">Property: </li> 
        <li><img src="images/modal2.png" alt="">Property: </li> 
        <li><img src="images/modal3.png" alt="">Property: </li> 
       </ul> 
       <button type="button" class="btn btn-lg buyBtn"> 
        <a href="myPaypalLink" target="_blank">Buy Now X$</a> 
       </button> 
      </div> 
     </div> 
    </div> 
</div> 

Кроме того, моя кнопка с «» метки, которые я использую в моей модальные, а также без модальных в моем HTML:

<button type="button" class="btn btn-lg buyBtn"> 
    <a href="myPaypalLink" target="_blank">Buy Now X$</a> 
</button> 

не работает в Mozilla.

Answer 1

Неправильно помещать якорный тег a внутри метки button. Просто используйте привязку, и все будет работать нормально.

<a href="#modal1" data-toggle="modal" type="button" class="btn btn-lg accountBtn"> 
    Account details 
</a>