diff options
| author | Catalin Zalog <[email protected]> | 2017-04-08 13:57:45 +0300 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2017-04-08 12:38:37 -0700 |
| commit | 758503e9ae1456b7bfb679d3dc2b8498b50458f9 (patch) | |
| tree | a41222b03d828a6b9e84d844a2f9cacffbf3ee62 | |
| parent | 8423e5c3e6ded8094d22581503812f4d507be24e (diff) | |
| download | bootstrap-758503e9ae1456b7bfb679d3dc2b8498b50458f9.tar.xz bootstrap-758503e9ae1456b7bfb679d3dc2b8498b50458f9.zip | |
css: .navbar child's aligning
Vertical centering `.navbar` flex children's
Demo: http://jsbin.com/fibini
| -rw-r--r-- | scss/_navbar.scss | 6 |
1 files changed, 2 insertions, 4 deletions
diff --git a/scss/_navbar.scss b/scss/_navbar.scss index 1133776aa..854e7df12 100644 --- a/scss/_navbar.scss +++ b/scss/_navbar.scss @@ -19,6 +19,7 @@ position: relative; display: flex; flex-wrap: wrap; // allow us to do the line break for collapsing content + align-items: center; justify-content: space-between; // space out brand from logo padding: $navbar-padding-y $navbar-padding-x; @@ -28,6 +29,7 @@ > .container-fluid { display: flex; flex-wrap: wrap; + align-items: center; justify-content: space-between; @include media-breakpoint-down(nth(map-keys($grid-breakpoints), 1)) { @@ -45,7 +47,6 @@ .navbar-brand { display: inline-block; - align-self: flex-start; padding-top: $navbar-brand-padding-y; padding-bottom: $navbar-brand-padding-y; margin-right: $navbar-padding-x; @@ -102,7 +103,6 @@ // Button for toggling the navbar when in its collapsed state .navbar-toggler { - align-self: flex-start; // Prevent toggler from growing to full width when it's the only visible navbar child padding: $navbar-toggler-padding-y $navbar-toggler-padding-x; font-size: $navbar-toggler-font-size; line-height: 1; @@ -153,7 +153,6 @@ @include media-breakpoint-up($next) { flex-direction: row; flex-wrap: nowrap; - align-items: center; justify-content: flex-start; .navbar-nav { @@ -173,7 +172,6 @@ > .container, > .container-fluid { flex-wrap: nowrap; - align-items: center; } // scss-lint:disable ImportantRule |