Commit 1a2ef331 authored by Ross Allen's avatar Ross Allen
Browse files

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.
parent 0a1c46a1
Showing with 4 additions and 6 deletions
+4 -6
...@@ -15,10 +15,6 @@ body { ...@@ -15,10 +15,6 @@ body {
/* Special class on .container surrounding .navbar, used for positioning it into place. */ /* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper { .navbar-wrapper {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 10; z-index: 10;
} }
...@@ -30,6 +26,9 @@ body { ...@@ -30,6 +26,9 @@ body {
/* Carousel base class */ /* Carousel base class */
.carousel { .carousel {
margin-bottom: 60px; 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 */ /* Since positioning the image, we need to help out the caption */
.carousel-caption { .carousel-caption {
...@@ -119,7 +118,6 @@ body { ...@@ -119,7 +118,6 @@ body {
/* Navbar positioning foo */ /* Navbar positioning foo */
.navbar-wrapper { .navbar-wrapper {
margin-top: 20px; 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 */ /* The navbar becomes detached from the top, so we round the corners */
.navbar-wrapper .navbar { .navbar-wrapper .navbar {
...@@ -133,4 +131,4 @@ body { ...@@ -133,4 +131,4 @@ body {
line-height: 1.4; line-height: 1.4;
} }
} }
\ No newline at end of file
Supports Markdown
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