Bootstrap Navbar коллапс не работает

Question

Начиная изучать Bootstrap и есть проблема ... Мой Navbar переключатель не работает по какой-то причине ...
Вот мой код:

<nav> 
     <div class="container"> 
      <div class="row"> 

       <div class="navbar-header"> 
        <a href="#" class="navbar-brand logo"> 
         <img src="img/logo.png" alt="Logo"> 
        </a> 

        <button class="navbar-toggle collapsed menu_btn" data-toogle="collapse" data-target="#top_menu"> 
         Menu 
        </button> 
       </div> 

       <div class="collapse navbar-collapse navbar-right" id="top_menu"> 
        <ul class="menu"> 
         <li><a href="#">Features</a></li> 
         <li><a href="#">Works</a></li> 
         <li><a href="#">our team</a></li> 
         <li><a href="#">testimoials</a></li> 
         <li><a href="#">download</a></li> 
        </ul> 
       </div> 
      </div> 
      <div class="top_line"></div> 
     </div> 
    </nav> 

Библиотеки являются правильными.

Спасибо!

Answer 1

У вас есть опечатка ..

data-toogle="collapse" 

должен быть

data-toggle="collapse" 

Answer 2

<div class="container"> 
    <div class="row"> 
    <nav class="navbar navbar-default"> 
     <div class="navbar-header"> 
      <a href="#" class="navbar-brand logo"> 
       <img src="img/logo.png" alt="Logo" /> 
      </a> 
      <button class="navbar-toggle collapsed menu_btn" data-toggle="collapse" data-target="#top_menu">Menu</button> 
     </div> 
     <div class="collapse navbar-collapse navbar-right" id="top_menu"> 
     <ul class="nav navbar-nav" class="menu"> 
      <li><a href="#">Features</a></li> 
      <li><a href="#">Works</a></li> 
      <li><a href="#">our team</a></li> 
      <li><a href="#">testimoials</a></li> 
      <li><a href="#">download</a></li> 
     </ul> 
     </div> 
    </nav> 
    </div> 
    <div class="top_line"></div> 
</div>