rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

remove .navbar-container; just need .navbar now

Browse Source
This commit is contained in:
Mark Otto 2016-12-21 13:07:57 -08:00 committed by Mark Otto
parent 819978cb71
commit bc1afa093a
1 changed files with 95 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

202
docs/examples/navbar/all-navbars.html
View File

@ -21,8 +21,32 @@
<body>
<nav class="navbar navbar-dark bg-inverse">
<div class="navbar-container">
<a class="navbar-brand" href="#">Default</a>
<a class="navbar-brand" href="#">Default</a>
<ul class="nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</nav>
<nav class="navbar navbar-dark bg-inverse">
<button class="navbar-toggler navbar-toggler-right hidden-lg-up" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"></button>
<a class="navbar-brand" href="#">Responsive</a>
<div class="collapse navbar-toggleable-md" id="navbarResponsive">
<ul class="nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
@ -45,37 +69,36 @@
</nav>
<nav class="navbar navbar-dark bg-inverse">
<div class="navbar-container">
<button class="navbar-toggler navbar-toggler-right hidden-lg-up" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"></button>
<a class="navbar-brand" href="#">Responsive</a>
<div class="collapse navbar-toggleable-md" id="navbarResponsive">
<ul class="nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</div>
</div>
<a class="navbar-brand" href="#">Justified &amp; Centered nav</a>
<ul class="nav navbar-nav text-md-center">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</nav>
<nav class="navbar navbar-dark bg-inverse">
<div class="navbar-container navbar-container-justified">
<a class="navbar-brand" href="#">Justified &amp; Centered nav</a>
<ul class="nav navbar-nav text-md-center">
<div class="container">
<nav class="navbar navbar-light navbar-rounded bg-faded">
<div class="navbar-item">
<a class="navbar-brand" href="#">Default</a>
</div>
<ul class="navbar-item nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
@ -89,93 +112,58 @@
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="form-inline text-md-right">
<form class="navbar-item form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</div>
</nav>
<div class="container">
<nav class="navbar navbar-light navbar-rounded bg-faded">
<div class="navbar-container">
<div class="navbar-item">
<a class="navbar-brand" href="#">Default</a>
</div>
<ul class="navbar-item nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="navbar-item form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</div>
</nav>
<nav class="navbar navbar-light navbar-rounded bg-faded">
<div class="navbar-container">
<div class="navbar-item">
<a class="navbar-brand" href="#">Primary</a>
</div>
<ul class="navbar-item navbar-item-primary nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="navbar-item form-inline text-xs-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
<div class="navbar-item">
<a class="navbar-brand" href="#">Primary</a>
</div>
<ul class="navbar-item navbar-item-primary nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="navbar-item form-inline text-xs-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</nav>
<nav class="navbar navbar-light navbar-rounded bg-faded">
<div class="navbar-container navbar-container-justified">
<div class="navbar-item">
<a class="navbar-brand" href="#">Justified &amp; Centered nav</a>
</div>
<ul class="navbar-item nav navbar-nav text-md-center">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="navbar-item form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
<div class="navbar-item">
<a class="navbar-brand" href="#">Justified &amp; Centered nav</a>
</div>
<ul class="navbar-item nav navbar-nav text-md-center">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Features</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
</ul>
<form class="navbar-item form-inline text-md-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-outline-success my-2 my-md-0" type="submit">Search</button>
</form>
</nav>