html - Adjust Search Form on Navbar Bootstrap 3 -


trying code working hamburger glyphicon, , nav-brand on left hand side on right hand side (left - right) have search form -> message glyph -> user glyph

i have in correct order now, reason cannot search form other side unless use pull-right , puts on opposite side of glyphs

    <!-- navigational bar --> <nav id="navbar" class="navbar navbar-default" role="navigation">     <div class="navbar-header">         <button href="#menu-toggle" class="slidebar-toggle" id="menu-toggle">             <span class="glyphicon glyphicon-menu-hamburger blue"></span>         </button>             <span><a class="navbar-brand" href="/">title</a></span>     </div>       <!-- menu & search items right side of navbar -->         <div class="navbar-collapse collapse pull-right">             <div class="container-fluid">                 <ul class="nav navbar-nav">                     <li class="dropdown">                         <a href="#" class="alerts"><i class="glyphicon glyphicon-comment blue"></i></a>                     </li>                     <li class="dropdown">                             <a href="#" class="alerts" data-toggle="dropdown"><i class="glyphicon glyphicon-user blue"></i><b class="caret"></b></a>                         <ul class="dropdown-menu">                             <li><a href="/"><i class="glyphicon glyphicon-user"></i> link 1</a></li>                             <li><a href="/"><i class="glyphicon glyphicon-plus"></i> link 2</a></li>                             <li><a href="/"><i class="glyphicon glyphicon-cog"></i>  link 3</a></li>                               </ul>                     </li>                         </ul>             </div>         </div>         <div id="search_block_top" class="col-sm-8 clearfix">              <form class="navbar-form" role="search">                 <div class="input-group">                     <input type="text" class="form-control" placeholder="search" name="srch-term" id="srch-term">                         <div class="input-group-btn">                             <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search blue"></i></button>                         </div>                 </div>             </form>              </div> </nav>   

just looking way search form moved on right, appreciated

move search_block_top div above navbar-collapse div, remove col-sm-8 class , clearfix class , give class of pull-right


Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -