JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header menu">
<button type="button" class="navbar-toggle collapsed menu" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Раскрыть меню</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Лого</a>
</div><!-- navbar-header -->
<div class="navbar-collapse collapse" id="bs-example-navbar-collapse-1">
<div class="moduletable">
<ul class="nav menu navbar-nav">
<li class="item-101"><a href="/agm_before_update_to_J3/catalog">Каталог</a></li>
<li class="item-191"><a href="/agm_before_update_to_J3/kontakty">Контакты</a></li>
<li class="item-121"><a href="/agm_before_update_to_J3/o-kompanii">О нас</a></li>
<li class="item-145"><a href="/agm_before_update_to_J3/pomoshch">Помощь</a></li>
<li class="item-178"><a href="/agm_before_update_to_J3/obzory">Обзоры</a></li>
</ul>
</div>
</div><!-- navbar-collapse collapse -->
<div class="navbar-header srch">
<button type="button" class="navbar-toggle collapsed srch" data-toggle="collapse" data-target="#bs-example-navbar-collapse-2" aria-expanded="false"> <span class="sr-only">Раскрыть меню</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div><!-- navbar-header -->
<div class="navbar-collapse collapse navbar-right" id="bs-example-navbar-collapse-2">
<div class="moduletable">
...
CSS
i.glyphicon.glyphicon-search {
color:white;
}
#bs-example-navbar-collapse-2 {
position:absolute;
top:0;
right:0;
}
.navbar-toggle.srch {
position:absolute;
top:0;
right:2em;
}
.navbar-toggle.menu {
position:absolute;
top:0;
right:5em;
}