Bootstrap Tutorial for Beginners – 6 – Navbar

Facebook –
GitHub –
Google+ –
LinkedIn –
reddit –
Support –
thenewboston –
Twitter –






29 responses to “Bootstrap Tutorial for Beginners – 6 – Navbar”

  1. Umer hafeez Avatar

    what Type of Editor he using

  2. Punit pandey Avatar

    all videos are awesome ……pls, add the video about the SEO and how to add https and how to be in google. step by step guide to how to buy http,robots.txt,sitemap and other

  3. retsam eltrut Avatar

    if your output is not from left to right but from top to bottom with bullets, check your unordered list closing tags </ul> , my editor automatically added it without me noticing and had that output before figuring out.

  4. Farhan khan Avatar

    boostrap js is not working

  5. Jose Alfredo Avatar

    I dont have some classes on my bootstrap.min like navbar-default and navbar-header. What should I do?

  6. eLLiot mLEB Avatar

    Instead of a text brand , how would one use a image, in the nav for a logo?

  7. Russ Hannamon Avatar

    How to get into freelancing?
    Should I learn everything before doing the actual work?
    Or should I learn along the way??

  8. Ahmad abdulkarim Avatar

    sir all your tutorials the screen are very clear, but bootstrap tutorials screen are not

  9. Kevin DeLaune Avatar

    Finally! Someone actually breaks down the Bootstrap Navbar, rather than Copying and Pasting the code, and then trying to explain it. Your method is 100x more effective in pushing the knowledge into our brains.

  10. Mike Shainski Avatar

    Dude, this was INVALUABLE! Thank you from the bottom of this noob's heart. I learned it all only recently, and remembering it all is a bitch. Your instructions are to the point and so easy to follow, I now have it all down

  11. Chrisell Bencalo Avatar

    Hi. Can you please help me? I did everything on your tutorial, but the output on mine is not the same as yours, what I only have is words like this.


    Help me please. Thanks 🙂

  12. Chen Roche Avatar

    Do Like your tutos!!! Very useful !!! THX

  13. Robson Sousa Avatar

    Pretty good! These tutorials are helping me alot! Thank you!

  14. Richard Zeng Avatar

    This helped a lot but I have a question:
    your nav is border by a grey rectangle and the active list is even darker. On mine, I don't see this. Is this because bootstrap might have change the settings or is this something I did? Thanks a lot

  15. True Mexico Avatar

    This is useful and helped. But in the real world what company/site uses a bolded text as their logo in the nav bar?! It's their REAL logo, an image. It would be great how you explained how to make a bootstrap logo for the real world…. logo on left side, menu items on right side. When brower smaller it changes via responsive rules, eg nav optios now directly below your company logo.

  16. Abhishek Choudhary Khatkar Avatar

    What about if i want to show the menu on the user is active?
    It only show Home button active. If user goes to about menu then also Home button is shown active. How to correct this?

  17. Kd_M Avatar

    It didn't come up like yours:

    <nav class="navbar navbar-default">
    <div class="container-fluid">

    <div class="navbar-header">
    <a href="navbar-brand">KDM MUSIC</a>

    <ul class="navbar-nav">
    <li class="active"><a href="#">Home</a></li>
    <li><a href="#">Beats</a></li>
    <li><a href="#">Tutorials</a></li>


  18. Kd_M Avatar

    Do I need to install jquery?

  19. Kd_M Avatar

    thenewboston part was exactly like yours but the <ul></ul> was the messed up part. I don't know why but when I opened in chrome the list was going down the left side of the page instead of across the top like you showed. HELP.

  20. MUN WebTeam Avatar

    How will I make the logo display an image that links to the homepage and not just the text.

  21. cvetidesign Avatar

    I have a problem with this styling because my "buttons" are fit of all of the page. So my menu look like on the first line Home, below this: About and below this: Contact. The main reason is they are not float left. How to fix it.

  22. Kim Jong-un Avatar

    dont understand a fuck of it XD

  23. saby8765 Avatar

    Fantastic tutorial

  24. Paul Padua Avatar

    Can somebody tell me how to change the height of the navbar? And how you would go about putting an image instead of text within the area for the logo/navbar-header?

  25. Anthony Parziale Avatar

    For some reason when I add lets say 2 more <li>'s to the navbar, it stacks them 3 on top of two. Anyone know why this is happening?

  26. Rishi Raj Gujadhur Avatar

    I shall never forget this now  

     <nav class="navbar navbar-default">
            <div class="container-fluid">
                <!– Logo –>
                <div class="navbar-header">
                    <a href="#" class="navbar-brand">THENEWBOSTON</a>


Leave a Reply

Your email address will not be published. Required fields are marked *