From 1a2ef331fdbe0a9f1e886146eba6d750f0ea5d3d Mon Sep 17 00:00:00 2001
From: Ross Allen <reallen@gmail.com>
Date: Thu, 18 Jul 2013 14:57:27 -0700
Subject: [PATCH] Let .navbar-wrapper flow in Carousel example
A .navbar-wrapper followed by a .carousel works well in this example,
but when the navbar is not followed by a carousel, content flows
underneath the navbar because it is absolutely positioned.
Letting .navbar-wrapper be part of the flow and moving the negative
margin to the .carousel to bring it underneath the navbar makes these
example styles suitable for pages without carousels.
---
carousel/example.css | 10 ++++------
1 file changed, 4 insertions(+), 6 deletions(-)
diff --git a/carousel/example.css b/carousel/example.css
index d31149b2ef..3d997481ef 100644
--- a/carousel/example.css
+++ b/carousel/example.css
@@ -15,10 +15,6 @@ body {
/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
z-index: 10;
}
@@ -30,6 +26,9 @@ body {
/* Carousel base class */
.carousel {
margin-bottom: 60px;
+
+ /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
+ margin-top: -90px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
@@ -119,7 +118,6 @@ body {
/* Navbar positioning foo */
.navbar-wrapper {
margin-top: 20px;
- margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
}
/* The navbar becomes detached from the top, so we round the corners */
.navbar-wrapper .navbar {
@@ -133,4 +131,4 @@ body {
line-height: 1.4;
}
-}
\ No newline at end of file
+}
--
GitLab