Reputation: 79
Trying to Get this code working so the Hamburger Glyphicon, and the Nav-Brand are on the left hand side then on the right hand side from (Left - Right) I would have the search form -> Message Glyph -> User Glyph
I have it in the correct order now, but for some reason I cannot get the Search form to the other side unless i use Pull-right and it puts it on the opposite side of the 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 for a way to get that Search form moved over to the right, any help would be appreciated
Upvotes: 0
Views: 107
Reputation: 1021
Move the search_block_top
div above the navbar-collapse
div, remove the col-sm-8
class and clearfix
class and give it a class of pull-right
Upvotes: 1