diff --git a/scss/_navbar.scss b/scss/_navbar.scss index 9a9dc3a1a6..1756eaca12 100644 --- a/scss/_navbar.scss +++ b/scss/_navbar.scss @@ -9,7 +9,13 @@ @include media-breakpoint-up(sm) { display: flex; - flex: 0 0 auto; + // flex: 0 0 auto; + flex-wrap: nowrap; + align-items: center; + } + + // For nesting containers, have to redeclare for alignment purposes + > .container { flex-wrap: nowrap; align-items: center; } @@ -26,7 +32,6 @@ } - // Navbar alignment options // // Display the navbar across the entirety of the page or fixed it to the top or @@ -62,19 +67,14 @@ .navbar-brand { display: inline-block; - padding-top: .25rem; - padding-bottom: .25rem; + margin-right: $navbar-padding-x; font-size: $font-size-lg; line-height: inherit; + white-space: nowrap; @include hover-focus { text-decoration: none; } - - @include media-breakpoint-up(sm) { - padding-right: .5rem; - padding-left: .5rem; - } } .navbar-divider { @@ -258,6 +258,8 @@ $infix: breakpoint-infix($breakpoint, $grid-breakpoints); &#{$infix} { @include media-breakpoint-down($breakpoint) { + flex-grow: 10; + .navbar-nav { .dropdown-menu { position: static;