Skip to content

Commit

Permalink
css: .navbar-expand .dropdown position
Browse files Browse the repository at this point in the history 
Set/reset `.dropdown` position when `.navbar-expand`.

Demo: http://jsbin.com/pojecuh
  • Loading branch information
@zalog @mdo
zalog authored and mdo committed Apr 8, 2017
1 parent 2436ad5 commit 8423e5c
Showing 1 changed file with 5 additions and 1 deletion.
6 changes: 5 additions & 1 deletion scss/_navbar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
justify-content: space-between;

@include media-breakpoint-down(nth(map-keys($grid-breakpoints), 1)) {
width: 100%; // prevent flex parent container(-fluid) from collapsing
width: 100%; // prevent flex parent container from collapsing
margin-right: 0;
margin-left: 0;
}
Expand Down Expand Up @@ -159,6 +159,10 @@
.navbar-nav {
flex-direction: row;

.dropdown-menu {
position: absolute;
}

.nav-link {
padding-right: .5rem;
padding-left: .5rem;
Expand Down

2 comments on commit 8423e5c

@netsamir
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello,

This commit has broken the navbar collapsing behaviour.

Whatever is the size of the viewport the navbar is collapsed. The commit just before
e20d744 was still good.

Here in that case, with Chrome, the button collapsed is on the left and the brand is on the right. But there is no way to have the navbar not collapsed.

I hope my explanation is clear, if not I could try to generate a screenshot.

Regards,

@netsamir
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, you have renamed the class navbar-togglable-* to navbar-expand-*

Please sign in to comment.