導航欄不在iPad上摺疊縱向和橫向

Question

我編寫了一個導航欄使用引導程序，它的工作完美，但是當我在iPad上嘗試它時，它在縱向和橫向上不會摺疊。我試圖改變@media（最大寬度和我的引導CSS文件的最小寬度的一部分，但仍然沒有工作。

<nav class="navbar navbar-default navbar-fixed-top"> 
     <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
      <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="http://www.linkhere.com/"><img src="../common/images/logo.png" width="120px" height="35px" style="vertical-align:middle"/></a> 
     </div> 
     <div id="navbar" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
      <li class="<?php echo c("news"); ?>"><a href="news.php">News</a></li> 
      <li class="dropdown <?php echo c("products,wrapper,consulting") ?>" > 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Products/Services <span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
       <li class="<?php echo c("products")?>"><a href="products.php">Overview</a></li> 
       <li class="<?php echo c("wrapper")?>"><a href="wrapper.php">Wrapper</a></li> 
       <li class="<?php echo c("consulting")?>"><a href="consulting.php">Consulting/Development</a></li> 
       </ul> 
      </li> 
     <li class="dropdown <?php echo c("company,contact,management, careers") ?>"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Company<span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
       <li class="<?php echo c("company")?>"><a href="company.php">About us</a></li> 
       <li class="<?php echo c("contact")?>"><a href="contact.php">Contact</a></li> 
       <li class="<?php echo c("management")?>"><a href="management.php">Management</a></li> 
       <li class="<?php echo c("careers")?>"><a href="careers.php">Careers</a></li> 
       </ul> 
      </li> 
      <li class="dropdown <?php echo c("customers, distributors")?>"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Customers/Distributors <span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
       <li class="<?php echo c("customers.php")?>"><a href="customers.php">Customers</a></li> 
       <li class="<?php echo c("distributors.php")?>"><a href="distributors.php">Distributors</a></li> 
       </ul> 
      </li> 
      <li> 
       <li class="<?php echo c("news"); ?>"><a href="#">What</a></li> 
      </li> 
      <li> 

     </li> 
      </ul> 

     <form class="navbar-form pull-left" role="search"> 
      <div class="input-group"> 
       <input type="text" class="form-control" placeholder="Search" style="margin-left:20px;"> 
       <div class="input-group-btn"> 
        <button type="submit" class="btn btn-mg" style="background-color:#fff"><span class="glyphicon glyphicon-search" ></span></button> 
       </div> 
      </div> 
     </form> 
     </div><!--/.nav-collapse --> 
     </div> 
    </nav> 

Answer 1

加入這個頁眉部分

<meta http-equiv="X-UA-Compatible" content="IE-edge"> 
<meta name="viewport" content="width = device-with, initial-scale = 1">