具有徽標的Bootstrap 3導航欄問題

Question

bootstrap3響應式導航欄和徽標有問題-它在台式機上可以正常顯示並且工作正常。 在移動設備上且合攏時，我可以單擊按鈕，但菜單不會顯示-只是水平滾動條。 我被困住了。 這是我的HTML代碼

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!-- Bootstrap links --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <div class="container"> <nav class="navbar navbar-default navbar-static-top" role="navigation"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle" 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-left" href="#"> <img src="" alt="logo" id="sitelogo" /> </a> </div> <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li><a href="index.php">Home</a></li> <li><a href="what-we-do.php">What We Do</a></li> <li><a href="case-studies.php">Case Studies</a></li> </ul> </div> </div> </nav> </div> 

Answer 1

您是否嘗試移除

aria-expanded="false" aria-controls="navbar"

Answer 2

增加height: auto!important; 到#navbar並刪除position: absolute; 從#navbar .nav ，那應該可以解決問題。