From the course: Bootstrap 3 Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Collapsing your navigation

Collapsing your navigation - Bootstrap Tutorial

From the course: Bootstrap 3 Essential Training

Start my 1-month free trial

Collapsing your navigation

“

- When you view a navigation component on an access breakpoint, that means a breakpoint that is smaller than 768 pixels, the navigation is going to stack up on top of one another like this. So whenever we get to that breakpoint, you can see that it stacks up. In those instances, it's common to display something called a Hamburger menu that expands to display the complete list. Now Bootstrap offers some classes to be able to take care of that. So I have simplified my navigation from the previous movie just a bit. I don't like to show code that is overly complex especially when I'm already showing you something that is in itself quite complex. So to collapse the menu into a hamburger, the first step is to group our navigation that will be collapsed by wrapping it with a div. So I'll take this unordered list right here and I'm going to create an additional div, and this is going to have a class of collapse. And let's go ahead and paste that navigation there and align it a little bit…

Contents