Skip to content

B
bootstrap
Commit b0aef6cd authored by Luis Aleman's avatar Luis Aleman
Browse files
Options

Removed containers, and moved brand to after the navbar-toggle

parent 80ff4bf8
Hide whitespace changes
Inline Side-by-side
Showing with 60 additions and 64 deletions
javascript.html
View file @ b0aef6cd
...@@ -356,53 +356,51 @@ $('#myModal').on('hidden.bs.modal', function () { ...@@ -356,53 +356,51 @@ $('#myModal').on('hidden.bs.modal', function () {
<h3>Within a navbar</h3> <h3>Within a navbar</h3>
<div class="bs-example"> <div class="bs-example">
<nav id="navbar-example" class="navbar navbar-static" role="navigation"> <nav id="navbar-example" class="navbar navbar-static" role="navigation">
<div class="container" style="width: auto;"> <div class="navbar-header">
<div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-collapse">
<a class="navbar-brand" href="#">Project Name</a> <span class="sr-only">Toggle navigation</span>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-collapse"> <span class="icon-bar"></span>
<span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span>
<span class="icon-bar"></span> <span class="icon-bar"></span>
<span class="icon-bar"></span> </button>
<span class="icon-bar"></span> <a class="navbar-brand" href="#">Project Name</a>
</button> </div>
</div> <div class="navbar-collapse collapse bs-js-navbar-collapse">
<div class="navbar-collapse collapse bs-js-navbar-collapse"> <ul class="nav navbar-nav">
<ul class="nav navbar-nav"> <li class="dropdown">
<li class="dropdown"> <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> <ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
<ul class="dropdown-menu" role="menu" aria-labelledby="drop1"> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li> <li role="presentation" class="divider"></li>
<li role="presentation" class="divider"></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li> </ul>
</ul> </li>
</li> <li class="dropdown">
<li class="dropdown"> <a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
<a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a> <ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
<ul class="dropdown-menu" role="menu" aria-labelledby="drop2"> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li> <li role="presentation" class="divider"></li>
<li role="presentation" class="divider"></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li> </ul>
</ul> </li>
</li> </ul>
</ul> <ul class="nav navbar-nav pull-right">
<ul class="nav navbar-nav pull-right"> <li id="fat-menu" class="dropdown">
<li id="fat-menu" class="dropdown"> <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
<a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a> <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
<ul class="dropdown-menu" role="menu" aria-labelledby="drop3"> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li> <li role="presentation" class="divider"></li>
<li role="presentation" class="divider"></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li> </ul>
</ul> </li>
</li> </ul>
</ul> </div><!-- /.nav-collapse -->
</div><!-- /.nav-collapse -->
</div><!-- /.container -->
</nav> <!-- /navbar-example --> </nav> <!-- /navbar-example -->
</div> <!-- /example --> </div> <!-- /example -->
...@@ -529,24 +527,22 @@ $('#myDropdown').on('show.bs.dropdown', function () { ...@@ -529,24 +527,22 @@ $('#myDropdown').on('show.bs.dropdown', function () {
<p>The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.</p> <p>The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.</p>
<div class="bs-example"> <div class="bs-example">
<nav id="navbar-example2" class="navbar navbar-static" role="navigation"> <nav id="navbar-example2" class="navbar navbar-static" role="navigation">
<div class="container" style="width: auto;"> <div class="navbar-header">
<div class="navbar-header"> <a class="navbar-brand" href="#">Project Name</a>
<a class="navbar-brand" href="#">Project Name</a>
</div>
<ul class="nav navbar-nav">
<li><a href="#fat">@fat</a></li>
<li><a href="#mdo">@mdo</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#one">one</a></li>
<li><a href="#two">two</a></li>
<li class="divider"></li>
<li><a href="#three">three</a></li>
</ul>
</li>
</ul>
</div> </div>
<ul class="nav navbar-nav">
<li><a href="#fat">@fat</a></li>
<li><a href="#mdo">@mdo</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#one">one</a></li>
<li><a href="#two">two</a></li>
<li class="divider"></li>
<li><a href="#three">three</a></li>
</ul>
</li>
</ul>
</nav> </nav>
<div data-spy="scroll" data-target="#navbar-example2" data-offset="0" class="scrollspy-example"> <div data-spy="scroll" data-target="#navbar-example2" data-offset="0" class="scrollspy-example">
<h4 id="fat">@fat</h4> <h4 id="fat">@fat</h4>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment