fix broken navbar collapse

This commit is contained in:
Mark Otto 2012-01-29 16:35:55 -08:00
parent d637db1a23
commit 702d3b6dfe
13 changed files with 36 additions and 23 deletions

Binary file not shown.

View File

@ -305,12 +305,14 @@
.btn-navbar {
display: block;
}
.nav-collapse.collapse {
.nav-collapse {
overflow: hidden;
height: 0;
}
.nav-collapse.collapse.in {
height: auto;
}
@media (min-width: 940px) {
.nav-collapse.collapse {
height: auto !important;
}
}
@media (min-width: 1200px) {

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="active">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>
@ -345,13 +345,13 @@
<tbody>
<tr>
<td class="span3"><code>@warningText</code></td>
<td>#c09853</td>
<td class="swatch-col"><span class="swatch" style="background-color: #c09853;"></span></td>
<td>#f3edd2</td>
<td class="swatch-col"><span class="swatch" style="background-color: #f3edd2;"></span></td>
</tr>
<tr>
<td><code>@warningBackground</code></td>
<td>#f3edd2</td>
<td><span class="swatch" style="background-color: #f3edd2;"></span></td>
<td>#c09853</td>
<td><span class="swatch" style="background-color: #c09853;"></span></td>
</tr>
<tr>
<td><code>@errorText</code></td>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="{{index}}">
<a href="./index.html">{{_i}}Overview{{/i}}</a>

View File

@ -39,7 +39,7 @@
<span class="i-bar"></span>
</a>
<a class="brand" href="./index.html">Bootstrap</a>
<div class="nav-collapse collapse">
<div class="nav-collapse">
<ul class="nav">
<li class="">
<a href="./index.html">Overview</a>

View File

@ -22,6 +22,7 @@
}
// UP TO LANDSCAPE PHONE
// ---------------------
@ -103,11 +104,11 @@
}
// LANDSCAPE PHONE TO SMALL DESKTOP & PORTRAIT TABLET
// --------------------------------------------------
@media (max-width: 768px) {
// GRID & CONTAINERS
// -----------------
// Remove width from containers
@ -133,6 +134,7 @@
}
// PORTRAIT TABLET TO DEFAULT DESKTOP
// ----------------------------------
@ -225,6 +227,7 @@
}
// TABLETS AND BELOW
// -----------------
@media (max-width: 940px) {
@ -335,17 +338,25 @@
}
// Hide everything in the navbar save .brand and toggle button */
.nav-collapse.collapse {
.nav-collapse {
overflow: hidden;
height: 0;
}
.nav-collapse.collapse.in {
height: auto;
}
}
// DEFAULT DESKTOP
// ---------------
@media (min-width: 940px) {
.nav-collapse.collapse {
height: auto !important;
}
}
// LARGE DESKTOP & UP
// ------------------