Even the code I copied from getbootstrap.com is experiencing the same issue. Below is my custom code that functions perfectly on mobile devices with the collapsed menu. However, when the page width exceeds 768px, the list items are not displayed. No additional CSS was applied to #navbarCollapse, it simply serves as a selector for the data-toggle.
<header class="row">
<div class="navbar" id="navigation" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbarCollapse" aria-expanded="false">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<a href="#" class="navbar-brand" style="font-family: 'open sans condensed'; font-size: 30px;">Name</a>
<div id="navbarCollapse" class="collapse navbar-collapse">
<ul class="nav navbar-nav navmenu">
<li><a href="/">About</a></li><li><a href="#">Services</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div> <!-- End of Navigation -->
<div class="col-xs-12" id="banner">
<h1 class="bannertext">
Content <br>
<button type="button"class="btn btn-primary">GET STARTED</button>
</h1>
</div>
</header><!-- End of header-->