title: Bootstrap Navbar. When I press the button nothing happens
body: <p>I have a problem with my navbar. When the screen is small a Button appear, but when I press the button nothing happens.</p>
  
  <p>This is my code and i don't really know why the button in the Navebar doesn't do anything.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>body {
    font-family: Verdana;
    // letter-spacing: 1px;
  }
  #header,
  h1 {
    // color: #6f6f6f;
    color: #fff;
    font-size: 24px;
  }
  container {
    margin-left: auto;
    margin-right: auto;
  }
  #header {
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    height: 200px;
    padding-top: 10px;
    background: rgb(26, 84, 155);
    background: -moz-linear-gradient(45deg, rgba(26, 84, 155, 1) 0%, rgba(125, 185, 232, 1) 100%);
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(26, 84, 155, 1)), color-stop(100%, rgba(125, 185, 232, 1)));
    background: -webkit-linear-gradient(45deg, rgba(26, 84, 155, 1) 0%, rgba(125, 185, 232, 1) 100%);
    background: -o-linear-gradient(45deg, rgba(26, 84, 155, 1) 0%, rgba(125, 185, 232, 1) 100%);
    background: -ms-linear-gradient(45deg, rgba(26, 84, 155, 1) 0%, rgba(125, 185, 232, 1) 100%);
    background: linear-gradient(45deg, rgba(26, 84, 155, 1) 0%, rgba(125, 185, 232, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#1a549b', endColorstr='#7db9e8', GradientType=1);
  }
  table {
    float: left;
  }
  .beschreibung {
    width: 100%;
    float: left;
  }
  .text {
    float: left;
  }
  .person {
    float: left;
    margin-top: 20px;
    border-width: 1px;
    border-style: solid;
    border-color: #8ec6f7;
    padding: 2.5em;
    border-radius: 5px;
    text-align: justify;
  }
  .download {
    background-color: #8ec6f7;
    border-radius: 10px;
    width: 100px;
    color: #fff;
  }
  .footer {
    margin-top: 140px;
    width: 100%;
    height: 200px;
    background: #909090;
    float: bottom;
  }
  .footer,
  .foo {
    color: #fff;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE HTML&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;TestPage&lt;/title&gt;
    &lt;link rel="stylesheet" type="text/css" href="style.css"&gt;
    &lt;!-- Latest compiled and minified CSS --&gt;
    &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"&gt;
  
    &lt;!-- Optional theme --&gt;
    &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"&gt;
  
    &lt;!-- Latest compiled and minified JavaScript --&gt;
    &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"&gt;
    &lt;/script&gt;
    &lt;meta charset="utf-8" /&gt;
    &lt;link rel="icon" type="image/png" href="apple_logo.png" /&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
    &lt;!--nav bar--&gt;
    &lt;nav class="navbar navbar-default navbar-fixed-top"&gt;
      &lt;div class="container-fluid"&gt;
  
        &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"&gt;
          &lt;span class="sr-only"&gt;&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 class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
          &lt;ul class="nav navbar-nav"&gt;
            &lt;li class="active"&gt;&lt;a href="index.html"&gt;Home &lt;span class="sr-only"&gt;(current)&lt;/span&gt;       &lt;/a&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="about_us.html"&gt;About us&lt;/a&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="downloads.html"&gt;Downloads&lt;/a&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="navbar-header"&gt;
  
      &lt;/div&gt;
    &lt;/nav&gt;
  
    &lt;!--header--&gt;
    &lt;div id="header"&gt;
      &lt;div class="container"&gt;
        &lt;center&gt;
          &lt;h1&gt;Überschrift&lt;/h1&gt;
          &lt;h3&gt;unter überschrift&lt;/h3&gt;
        &lt;/center&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;!-- body-part --&gt;
    &lt;div class="container"&gt;
      &lt;h2&gt;News&lt;/h2&gt;
      &lt;hr/&gt;
      &lt;div class="line"&gt;
        &lt;div class="col-xs-6 col-sm-3"&gt;
          &lt;a href="#" class="thumbnail"&gt;
            &lt;img src="ip_doesnt_exist.jpg" alt="..."&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;h4&gt;Example heading&lt;/h4&gt;
        &lt;p class="text"&gt;jalösdjflkajglökadjflögkjaölkdfjölk jaölksjdföl jölkasdjfölka&lt;/p&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;p&gt;&lt;b&gt;1.1.1999&lt;/b&gt;
        &lt;/p&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;br/&gt;
  
        &lt;hr/&gt;
  
  
      &lt;/div&gt;
      &lt;div class="line"&gt;
        &lt;div class="col-xs-6 col-sm-3"&gt;
          &lt;a href="#" class="thumbnail"&gt;
            &lt;img src="ip_doesnt_exist.jpg" alt="..."&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;h4&gt;Example heading&lt;/h4&gt;
        &lt;p class="text"&gt;jalösdjflkajglökadjflögkjaölkdfjölk jaölksjdföl jölkasdjfölka&lt;/p&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;p&gt;&lt;b&gt;1.1.1999&lt;/b&gt;
        &lt;/p&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;br/&gt;
  
        &lt;hr/&gt;
      &lt;/div&gt;
  
      &lt;div class="line"&gt;
        &lt;div class="col-xs-6 col-sm-3"&gt;
          &lt;a href="#" class="thumbnail"&gt;
            &lt;img src="ip_doesnt_exist.jpg" alt="..."&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;h4&gt;Example heading&lt;/h4&gt;
        &lt;p class="text"&gt;jalösdjflkajglökadjflögkjaölkdfjölk jaölksjdföl jölkasdjfölka&lt;/p&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;p&gt;&lt;b&gt;1.1.1999&lt;/b&gt;
        &lt;/p&gt;
        &lt;br/&gt;
        &lt;br/&gt;
        &lt;br/&gt;
  
        &lt;hr/&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    
    &lt;div class="footer"&gt;
      &lt;div class="container"&gt;
        &lt;br/&gt;
        &lt;div class="row"&gt;
          &lt;div class="col-sm-12 col-md-12"&gt;
            &lt;a href="#"&gt;
              &lt;img src="facebook-icon.png" alt="facebook"&gt;
              &lt;p class="foo"&gt;Followe us on Facebook&lt;/p&gt;
            &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-12 col-md-12"&gt;
            &lt;a href="#"&gt;
              &lt;img src="google-plus-icon.png" alt="google+"&gt;
              &lt;p class="foo"&gt;Followe us on Google +&lt;/p&gt;
            &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-12 col-md-12"&gt;
  
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>