Я тестировал свой загрузочный сайт на различных устройствах, чтобы убедиться, что он отзывчив. У меня все правильно изменяется для разных размеров дисплея, кроме панели навигации. В моем браузере, когда я изменяю размер окна по горизонтали, кажется, что он реагирует, сворачивая меню, как и ожидалось, но на мобильных устройствах я по-прежнему вижу панель навигации, как если бы она отображалась в полноэкранном окне на рабочем столе или ноутбуке. Вот код моей панели навигации:
<div class="container">
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
<img alt="WinShir" src="img/rocket.png" /> WinShir
</a>
<button type='button' class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="sr-only">Toggle Navigation</span>
</button>
</div>
<ul class="nav navbar-nav navbar-right collapse navbar-collapse">
<li><a href="#signInModal" data-toggle="modal">Sign In</a></li>
<li><a href="#signupModal" data-toggle="modal">Sign Up</a></li>
</ul>
</div>
</nav>
</div>
Я попытался изменить элемент nav на div, чтобы посмотреть, помогло ли это, но безуспешно. Я также удалил закрывающий div класса контейнера, чтобы посмотреть, помогло ли это, но тоже не повезло.