Неправильное выравнивание в bootstrap navbar

Question

Так что я использую загрузочный навигатор на своем веб-сайте, и у меня есть панель поиска с кнопкой. Проблема в том, что кнопка появляется под панелью поиска, и я хотел, чтобы она появлялась рядом.

Вот как это сейчас ищет: http://tinypic.com/r/2ql5u9l/9

А вот мой Navbar код:

<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">DAW</a> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#">Home</a></li> 
     <li class="dropdown"> 
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">Artigos 
      <span class="caret"></span></a> 
      <ul class="dropdown-menu"> 
      <li><a href="artigos.php?catid=2">Desporto</a></li> 
      <li><a href="artigos.php?catid=3">Educação</a></li> 
      <li><a href="artigos.php?catid=1">Política</a></li> 
      <li><a href="artigos.php?catid=4">Fitness</a></li> 
      </ul> 
     </li> 
     <?php 
     if (isset($_SESSION['username']) && ($_SESSION['id'])) { 
     echo "<li><a href='inserir_artigo.php'>Inserir Artigos</a></li>"; 
     } 
     ?> 
     </ul> 
     <ul class="nav navbar-nav"> 
     <div class="input-group"> 
     <form action="procurar.php" method="GET"> 
     <li><input type="text" class="form-control inp" placeholder="Procurar por..." name="procurar" /></li> 
     <li><button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span></button></li> 
     </form> 
     </div> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
     <?php 
     if (isset($_SESSION['username']) && ($_SESSION['id'])) { 

     echo "<li><a href='editar_perfil.php?id=$iduser'><span class='glyphicon glyphicon-user'></span>".$_SESSION['username']."</a></li>"; 
      echo "<li><a href='logout.php'><span class='glyphicon glyphicon-log-in'></span> Logout</a></li>"; 
      } 

      else{ 
     echo "<li><a href='registo.php'><span class='glyphicon glyphicon-plus'></span> Registar</a></li>"; 
     echo "<li><a href='login.php'><span class='glyphicon glyphicon-log-in'></span> Login</a></li>"; 
     }?> 
     </ul> 
    </div> 
    </div> 
</nav> 

Answer 1

Формат Вы формируете правильно, не ставьте в уль теге

ссылка: http://getbootstrap.com/components/#navbar-default

<ul class="nav navbar-nav"> 
... 
</ul> 
<form class="navbar-form navbar-left" role="search"> 
    <div class="form-group"> 
    <input type="text" class="form-control" placeholder="Search"> 
    </div> 
    <button type="submit" class="btn btn-default">Submit</button> 
</form> 
<ul class="nav navbar-nav navbar-right"> 
... 
<ul> 

Answer 2

Используйте нижеследующий код для поиска

<form class="navbar-form navbar-left" role="search"> 
    <div class="form-group"> 
     <input type="text" class="form-control" placeholder="Search"> 
    </div> 
    <button type="submit" class="btn btn-default">Submit</button> 
    </form>