Commit f9a47e3a authored by Mark Otto's avatar Mark Otto

Refine containers and navbars

* Don't reset width on .container, .navbar-* .container, etc
* Instead, use max-width to ensure proper styling for all navbars
parent 030a0581
...@@ -223,10 +223,8 @@ a:hover { ...@@ -223,10 +223,8 @@ a:hover {
border-radius: 500px; border-radius: 500px;
} }
.container, .container {
.navbar-fixed-top .container, max-width: 940px;
.navbar-fixed-bottom .container {
width: 940px;
} }
.row { .row {
...@@ -5458,10 +5456,8 @@ a.badge:hover { ...@@ -5458,10 +5456,8 @@ a.badge:hover {
} }
@media (min-width: 1200px) { @media (min-width: 1200px) {
.container, .container {
.navbar-fixed-top .container, max-width: 1170px;
.navbar-fixed-bottom .container {
width: 1170px;
} }
.row { .row {
margin-right: -15px; margin-right: -15px;
......
...@@ -4,9 +4,9 @@ ...@@ -4,9 +4,9 @@
// Set the container width, and override it for fixed navbars in media queries // Set the container width, and override it for fixed navbars in media queries
.container, .container {
.navbar-fixed-top .container, max-width: 940px;
.navbar-fixed-bottom .container { width: 940px; } }
// Fixed (940px) // Fixed (940px)
#grid > .core(@gridColumnWidth, @gridGutterWidth, @gridRowWidth); #grid > .core(@gridColumnWidth, @gridGutterWidth, @gridRowWidth);
......
...@@ -6,10 +6,8 @@ ...@@ -6,10 +6,8 @@
@media (min-width: 1200px) { @media (min-width: 1200px) {
// Set the container width, and override it for fixed navbars in media queries // Set the container width, and override it for fixed navbars in media queries
.container, .container {
.navbar-fixed-top .container, max-width: 1170px;
.navbar-fixed-bottom .container {
width: 1170px;
} }
// Fixed grid // Fixed grid
......
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
<h1>Navbar example</h1> <h1>Navbar example</h1>
<p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p> <p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
<p> <p>
<a class="btn btn-large btn-primary" href="../components.html#navbar">View navbar docs &raquo;</a> <a class="btn btn-large btn-primary" href="../../docs/components.html#navbar">View navbar docs &raquo;</a>
</p> </p>
</div> </div>
......
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
<h1>Navbar example</h1> <h1>Navbar example</h1>
<p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p> <p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
<p> <p>
<a class="btn btn-large btn-primary" href="../components.html#navbar">View navbar docs &raquo;</a> <a class="btn btn-large btn-primary" href="../../docs/components.html#navbar">View navbar docs &raquo;</a>
</p> </p>
</div> </div>
......
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
<h1>Navbar example</h1> <h1>Navbar example</h1>
<p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p> <p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
<p> <p>
<a class="btn btn-large btn-primary" href="../components.html#navbar">View navbar docs &raquo;</a> <a class="btn btn-large btn-primary" href="../../docs/components.html#navbar">View navbar docs &raquo;</a>
</p> </p>
</div> </div>
......
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