Refine containers and navbars

* Don't reset width on .container, .navbar-* .container, etc
* Instead, use max-width to ensure proper styling for all navbars
This commit is contained in:
Mark Otto 2012-11-30 12:42:37 -08:00
parent 030a058174
commit f9a47e3a5f
6 changed files with 12 additions and 18 deletions

View File

@ -223,10 +223,8 @@ a:hover {
border-radius: 500px;
}
.container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
.container {
max-width: 940px;
}
.row {
@ -5458,10 +5456,8 @@ a.badge:hover {
}
@media (min-width: 1200px) {
.container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1170px;
.container {
max-width: 1170px;
}
.row {
margin-right: -15px;

View File

@ -4,9 +4,9 @@
// Set the container width, and override it for fixed navbars in media queries
.container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container { width: 940px; }
.container {
max-width: 940px;
}
// Fixed (940px)
#grid > .core(@gridColumnWidth, @gridGutterWidth, @gridRowWidth);

View File

@ -6,10 +6,8 @@
@media (min-width: 1200px) {
// Set the container width, and override it for fixed navbars in media queries
.container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1170px;
.container {
max-width: 1170px;
}
// Fixed grid

View File

@ -75,7 +75,7 @@
<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>
<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>
</div>

View File

@ -78,7 +78,7 @@
<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>
<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>
</div>

View File

@ -78,7 +78,7 @@
<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>
<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>
</div>