Я пытаюсь включить раскрывающееся меню внутри панели навигации с помощью Angular-UI Bootstrap. Пожалуйста, посмотрите это plnkr. Я играл с css, и я могу заставить его работать на настольной версии. Но когда дело доходит до просмотра на мобильных устройствах, мне приходится использовать множество других стилей. Так что явно что-то не так делаю. Может ли кто-нибудь показать мне, что я делаю неправильно.
<nav class="navbar navbar-inverse">
<div class="navbar-header">
<a href="/" class="navbar-brand"><span class="brand-title"></span></a>
<a class="btn navbar-btn navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
</div>
<div class="navbar-collapse collapse" >
<div class="pull-left navbar-logo">
<ul class="nav navbar-nav" >
<li>
<a data-ng-href="#/Search">Search</a>
</li>
<li>
<a data-ng-href="#/Search">Search2</a>
</li>
<div class="btn-group" uib-dropdown >
<a id="single-button" uib-dropdown-toggle ng-disabled="disabled">
Button dropdown <span class="caret"></span>
</a>
<ul uib-dropdown-menu role="menu" aria-labelledby="single-button">
<li role="menuitem"><a href="#">Action</a></li>
<li role="menuitem"><a href="#">Another action</a></li>
<li role="menuitem"><a href="#">Something else here</a></li>
<li class="divider"></li>
<li role="menuitem"><a href="#">Separated link</a></li>
</ul>
</div>
</ul>
</div>
</div>
</nav>
