Hack Forums
bootstrap help - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: bootstrap help (/showthread.php?tid=6021697)

bootstrap help - vyactor - Nov 3, 2019

So, basically I created a navigation menu with bootstrap. Everything looks fine but when I resize my browser to check its responsiveness, it just does what it is supposed to (display an icon accordingly). But when I click it, nothing just happens. It is supposed to get dropped down.
Code:
Code
<div class="navbar-collapse collapse">
                                   <ul class="nav navbar-nav navbar-right">
                                           <li><a href="index.html" title="Home">Home</a></li>
                                           <li><a href="#" title="Gallery">Gallery</a></li>
                                           <li><a href="#" title="Contact Us">Contact Us</a></li>
                                           <li><a href="#" title="About Us">About Us</a></li>
                                           <li><a href="#" title="Message from the Founder">Message from the Founder</a></li>
                                   </ul>
</div>

Do I need to create media queries for navbar-collapse for it to drop down when I click the icon?

RE: bootstrap help - Nachfolger - Nov 3, 2019

You cannot use HTML and CSS alone to do this, so if you don't have the Bootstrap javascript included, you will need to get that. I also don't see the button included here, so if you have a typo there, there is no way for us to know.

See https://stackoverflow.com/questions/20719607/bootstrap-3-navbar-collapse-button-not-working to make sure everything is correct with the collapse button.

RE: bootstrap help - vyactor - Nov 3, 2019

Code
<section class="header-wrapper navgiation-wrapper">

                       <div class="navbar navbar-default">
                           <div class="container">
       
                               <div class="navbar-header">
                                   <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                                           <span class="icon-bar"></span>
                                           <span class="icon-bar"></span>
                                           <span class="icon-bar"></span>
                                   </button>
                                   <a class="logo" href="index.html"><img alt="" src="images/logo.png"></a>
                               </div>
                               <div class="navbar-collapse collapse">
                                   <ul class="nav navbar-nav navbar-right">
                                           <li><a href="index.html" title="Home">Home</a></li>
                                           <li><a href="#" title="Gallery">Gallery</a></li>
                                           <li><a href="#" title="Contact Us">Contact Us</a></li>
                                           <li><a href="#" title="About Us">About Us</a></li>
                                           <li><a href="#" title="Message from the Founder">Message from the Founder</a></li>
                                   </ul>
                               </div>
                           </div>
                       </div>
       
                   </section>
       
Oops, there you go. I'll give a look at that link too soon. Any help from your side is even appreciated. What do you mean by bootstrap javascript? Isn't bootstrap.min.css is the file that I need to have?

Edit: Okay, so I was the dumb one. I added the javascript files and it worked out. Thank you for making me remember it xD. I appreciate your reply.