Skip to content

Instantly share code, notes, and snippets.

@bassjobsen
Created September 17, 2016 12:39
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bassjobsen/214792f5543b6b551befaea81178acf7 to your computer and use it in GitHub Desktop.
Save bassjobsen/214792f5543b6b551befaea81178acf7 to your computer and use it in GitHub Desktop.
Sass mixin to justifiy navbar links in Bootstrap 4, see also http://bassjobsen.weblogs.fm/bootstrap-4s-responsive-navbars/
// Justified nav links
// -------------------------
@mixin nav-justified($breakpoint: md) {
width: 100%;
.nav-item {
float: none;
}
.nav-link {
text-align: center;
margin-bottom: 5px;
}
> .dropdown .dropdown-menu { //todo: remove child selector
top: auto;
left: auto;
}
@include media-breakpoint-up($breakpoint) {
.nav-item {
display: table-cell;
width: 1%;
}
.nav-link {
margin-bottom: 0;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment