Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Piotr Manczak
Front End Web Development Techdegree Graduate 29,363 PointsWhat's the difference between nav and navbar?
What's the difference between nav and navbar? I always thought it's basically the same thing.
3 Answers
Steven Parker
231,268 PointsA "navbar" is an area on a page that contains navigation components (links, buttons, etc) for getting to other pages of the website.
A "nav" is an HTML element that is normally used to enclose other elements related to navigation. The complete set of the "nav" and the other elements it encloses would typically render the navbar.
Ray Thomas
12,478 Pointsyes but Boostrap4 has a class called nav too. The docs describe it as "The base .nav component is built with flexbox and provide a strong foundation for building all types of navigation components. It includes some style overrides (for working with lists), some link padding for larger hit areas, and basic disabled styling."
Steven Parker
231,268 PointsSo you might use the "nav" class in Bootstrap to construct a "navbar" on your page.
Ray Thomas
12,478 Pointsand there is also a navbar class in bootsrap. I think whichever she was asking about, we have wrapped up all the answers :)
Piotr Manczak
Front End Web Development Techdegree Graduate 29,363 PointsThanks everyone for the answers.
Ray Thomas
12,478 PointsRay Thomas
12,478 PointsThe answer is best summarized here. found this answer from freeCodeCamp user:
"...I believe .nav-bar is intended for the main page navigation on top of the page and has a whole bunch of styling attributes available. The .nav class is for simple navigation and adds a display: flex; attribute to the nav ul links. I believe you can have a .nav and style it with .nav-bar attributes if you just at the .nav-bar class to the element."