Bootstrap Модальный показ в Chrome и Chrome инспектор DevTools, но на реальном Iphone не переключается и не показывает

Question

Я создаю этот тестовый сайт, где я еще не разделил все CSS или JavaScript.Я прочитал Bootstrap документацию и следовал инструкциям «Приступая к работе», чтобы включить простой модальный компонент (в котором будет форма контакта с php) при нажатии кнопки «04- связаться".Этот модал появляется в Chrome и использует DevTools Chrome inspector, чтобы проверить адаптивную версию. Но при использовании моего iPhone для тестирования он не переключает модальное.

Ссылка такая:

У меня естьпопытался использовать простую кнопку и переопределить модальное свойство «position» в css, но все еще не переключается на iphone.Также переопределяет z-index, но все еще не работает только на мобильном телефоне.

<!-- Modal -->
<div class="modal fade" id="contactModal" tabindex="-1" role="dialog" aria-labelledby="contactModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="contactModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Кнопка:

<li id="left">
<a data-toggle="modal" data-target="#contactModal"> 04 get in touch</a>
</li>