Boostrap Mobile Menü nicht geöffnet

Question

Mein Bootstrap-Menü funktioniert nicht auf Mobilgeräten. Ich habe mehrmals nachgesehen, kann aber keinen Fehler sehen. Alles sieht gut aus, id und data-target sind korrekt.

<div class="navbar navbar-default"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
      <button class="navbar-toggle collapsed" data-target="#main-header" data-toggle="collapse" type="button"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="/home"> 
       <img alt="Brand" src="assets/img/logo.png"> 
      </a> 
     </div> 

     <div class="collapse navbar-collapse" id="#main-header"> 
      <ul class="nav navbar-nav"> 
       <li> 
        <a href="/demo">Demo1</a> 
       </li> 
       <li> 
        <a href="/demo">Demo1</a> 
       </li> 
      </ul> 

      <ul class="nav navbar-nav navbar-right"> 
       <li> 
        <p class="navbar-text"> 
         Welcome, M1 D1 
        </p> 
       </li>    
      </ul> 
     </div> 
    </div> 
</div> 

DEMO

Answer 1

Menü wechseln Id

id="#main-header" 

zu

id="main-header"