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

CSS Bootstrap 4 Basics (Retired) Using Bootstrap Components Building a Navbar

Luke Duffy
Luke Duffy
4,266 Points

I can not find this Navbar example in documentation

I can not find this navbar example in the documentation and when I copy this one and minimise it to xs the nav is stacked how do I fix this?

Andrea Monty
Andrea Monty
2,724 Points

There have been numerous changes since this video. Bootstrap in now in Alpha 6. It would be best to follow the teachers notes. With that said some of those are outdated now also. If you are still having problems I can post my code as it is working properly at the moment. With Bootstrap being still in Alpha there will be lots of changes and its a must to always read the documentation. With that said I did read in Bootstraps blog that this seems to be the last Alpha and will be releasing Beta soon with smaller changes.

1 Answer

Luke Duffy
Luke Duffy
4,266 Points

Hi Andrea, could you please send me the code it would be greatly appreciated! I honestly think if you are paying a subscription that the learning materials should be updated frequently. Cheers

Andrea Monty
Andrea Monty
2,724 Points

I do agree with you on that!!!!! Give me a little bit and i will send it to you!

If you want I can run thru where I had to search for a lot of the new documentation also. I can email you it may be easier than on here. But if you not comfortable with that I understand!!!

Andrea Monty
Andrea Monty
2,724 Points

In Bootstrap docs go to components---->Navbar--->Nav and you will find the original snippet. I hope this helps!!

 <!-- Navbar   -->

  <nav class="navbar navbar-toggleable-md fixed-top  navbar-inverse bg-primary">
<!--
  <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
-->


  <div class="container">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" href="#home">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#about">About</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#speakers">Speakers</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#schedule">Schedule</a>
      </li>
    </ul>
   </div>
        <a class="navbar-brand float-right m-r-0 hidden-xs-down" href="http://www.teamtreehouse.com">Presented by Treehouse</a>

  </nav>
    <!-- End Navbar   -->