Bootstrap 3 Navbar在移动浏览器上不会折叠,但会在尺寸较小的桌面窗口中显示 [英] Bootstrap 3 Navbar won't collapse on mobile browsers but will in undersized desktop window
本文介绍了Bootstrap 3 Navbar在移动浏览器上不会折叠,但会在尺寸较小的桌面窗口中显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
具有最新版本引导程序的My Rails 4网站不会在移动设备中崩溃,但是,如果我在桌面上打开该网站并缩小窗口,它将崩溃.这是我的导航栏的代码:
My Rails 4 site with the latest version of bootstrap will not collapse in mobile however if I open the site on desktop and shrink the window, it will collapse. Here is the code for my navbar:
<div class = "navbar navbar-inverse navbar-static-top">
<div class = "container">
<a href = "/" class = "navbar-brand" style="color: white;">Earn And Learn</a>
<button class = "navbar-toggle" data-toggle = "collapse" data-target = ".navHeaderCollapse">
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
</button>
<div class = "collapse navbar-collapse navHeaderCollapse">
<ul class = "nav navbar-nav navbar-right">
<li id="nav_ach"><a href = "/about/achievements" style="color: white;">Achievements</a></li>
<li id="nav_faq"><a href = "/about/faq" style="color: white;">FAQ</a></li>
<li id="nav_test"><a href = "/about/testimonials" style="color: white;">Testimonials</a></li>
<li id="nav_news"><a href = "/about/news" style="color: white;">In the News</a></li>
<li id="nav_steal"><a href = "/steal/index" style=" color: white;">Steal This Idea!</a></li>
<li><a href = "#" data-toggle="modal" data-target="#myModal" style="color: white;">Contact Us</a></li>
</ul>
</div>
</div>
</div>
推荐答案
仔细研究github问题,结果我们错过了这个问题
Dug through the github issues and it turns out we're missing this
<meta name="viewport" content="width=device-width, initial-scale=1.0">
http://getbootstrap.com/css/#overview-mobile
https://github.com/twbs/bootstrap/issues/10550
这篇关于Bootstrap 3 Navbar在移动浏览器上不会折叠,但会在尺寸较小的桌面窗口中显示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文