The default grid system provided as part of Bootstrap is a 940px-wide, 12-column grid.
-
It also has three responsive variations for various devices and resolutions: phone, tablet, and large widescreen desktops.
+
It also has four responsive variations for various devices and resolutions: phone, tablet portrait, table landscape and small desktops, and large widescreen desktops.
diff --git a/docs/templates/layout.mustache b/docs/templates/layout.mustache
index 7c0ab655be..b49ec28f6e 100644
--- a/docs/templates/layout.mustache
+++ b/docs/templates/layout.mustache
@@ -39,7 +39,7 @@
Bootstrap
-
+
-
{{_i}}Overview{{/i}}
diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index 75ca3eb7e4..fd7c464db4 100644
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -669,7 +669,7 @@
</form>
{{_i}}Optional responsive variation{{/i}}
- {{_i}}Depending on the amount of content in your topbar, you might want to implement the responsive options. To do so, wrap your nav content in a containing div, .nav-collapse
, and add the navbar toggle button, .btn-navbar
.{{/i}}
+ {{_i}}Depending on the amount of content in your topbar, you might want to implement the responsive options. To do so, wrap your nav content in a containing div, .nav-collapse.collapse
, and add the navbar toggle button, .btn-navbar
.{{/i}}
<div class="navbar">
<div class="navbar-inner">
@@ -686,7 +686,7 @@
<a class="brand" href="#">{{_i}}Project name{{/i}}</a>
<!-- Everything you want hidden at 940px or less, place within here -->
- <div class="nav-collapse">
+ <div class="nav-collapse collapse">
<!-- .nav, .navbar-search, .navbar-form, etc -->
</div>
diff --git a/docs/templates/pages/scaffolding.mustache b/docs/templates/pages/scaffolding.mustache
index 239d152652..15c438b975 100644
--- a/docs/templates/pages/scaffolding.mustache
+++ b/docs/templates/pages/scaffolding.mustache
@@ -55,7 +55,7 @@
{{_i}}The default grid system provided as part of Bootstrap is a 940px-wide, 12-column grid.{{/i}}
-
{{_i}}It also has three responsive variations for various devices and resolutions: phone, tablet, and large widescreen desktops.{{/i}}
+
{{_i}}It also has four responsive variations for various devices and resolutions: phone, tablet portrait, table landscape and small desktops, and large widescreen desktops.{{/i}}
diff --git a/docs/upgrading.html b/docs/upgrading.html
index d7ad30f561..b8e82fe31b 100644
--- a/docs/upgrading.html
+++ b/docs/upgrading.html
@@ -39,7 +39,7 @@
Bootstrap
-
+
-
Overview
diff --git a/less/navbar.less b/less/navbar.less
index 25ca7b4e28..b677b192b4 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -42,8 +42,9 @@
.btn-navbar .i-bar + .i-bar {
margin-top: 3px;
}
+// Override the default collapsed state
.nav-collapse.collapse {
- height: auto !important; // Required to be !important to override native collapse plugin
+ height: auto;
}
diff --git a/less/responsive.less b/less/responsive.less
index 107fa7dd77..7ae28b8258 100644
--- a/less/responsive.less
+++ b/less/responsive.less
@@ -240,7 +240,7 @@
position: static;
margin-bottom: @baseLineHeight;
}
- .navbar-inner {
+ .navbar-fixed-top .navbar-inner {
padding: 5px;
background-image: none;
}
@@ -335,10 +335,13 @@
}
// Hide everything in the navbar save .brand and toggle button */
- .nav-collapse {
+ .nav-collapse.collapse {
overflow: hidden;
height: 0;
}
+ .nav-collapse.collapse.in {
+ height: auto;
+ }
}