title: Why doesn't my dropdown menu work?
body: <blockquote>
    <p>My bootstrap dropdown menu appeared when the screen was shrunk, but when I clicked on it, nothing showed. I also added jQuery library, not sure if it was added the right way though.
    Please help! My html code is below...</p>
  </blockquote>
  
  <pre><code>   &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
          &lt;title&gt;Personal website&lt;/title&gt;
          &lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"&gt;
  
  
          &lt;link rel="stylesheet" href="css/stylesheet.css"&gt;
          &lt;link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3.5.2/animate.min.css"&gt;
          &lt;link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet" type="text/css"&gt;
  &lt;/head&gt;
        &lt;body&gt;
          &lt;header&gt;
          &lt;nav id ="header-nav" class="navbar navbar-default navbar-fixed-top"&gt;
            &lt;div class= "container"&gt;
              &lt;div class="navbar-header"&gt;
                &lt;div class="navbar-brand"&gt;
                  &lt;a href="index.html"&gt;&lt;h1 class="animated infinite swing"&gt;MY NAME&lt;/h1&gt;&lt;/a&gt;
                &lt;/div&gt; &lt;!--End of navbar brand--&gt;
  
                &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapsable-nav" aria-expanded="false"&gt;
                  &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                  &lt;span class="icon-bar"&gt;&lt;/span&gt;
                  &lt;span class="icon-bar"&gt;&lt;/span&gt;
                  &lt;span class="icon-bar"&gt;&lt;/span&gt;
                &lt;/button&gt;
              &lt;/div&gt; &lt;!-- End of navbar-header--&gt;
  
                &lt;div id="collapsable-nav" class="collapse navbar-collapse"&gt;
                 &lt;ul id="nav-list" class="nav navbar-nav navbar-right"&gt;
                  &lt;li&gt;
                    &lt;a href="#main-content"&gt;
                     Home&lt;/a&gt;
                  &lt;/li&gt; &lt;!--End of li 1--&gt;
                  &lt;li&gt;
                    &lt;a href="#about-me"&gt;
                      About Me&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                    &lt;a href="#project-tiles"&gt;
                      My Projects&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li&gt;
                    &lt;a href="#contact-info"&gt; Contact Me &lt;/a&gt;
                  &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt; &lt;!--End collapsable-nav--&gt;
            &lt;/div&gt; &lt;!--End header-nav--&gt;
          &lt;/nav&gt;
  &lt;/body&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
  </code></pre>