scroll

bootstrap scroll to ID wack

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/css/bootstrap.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script>
<div class="navbar navbar-default navbar-fixed-top" >

			<div class="container" >

				<div class="navbar-header" >

					<a href="index.html" class="navbar-brand" >scroll test</a>

					<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main" >
						<span class="icon-bar" ></span>
						<span class="icon-bar" ></span>
						<span class="icon-bar" ></span>
					</button>

				</div>

				<div class="navbar-collapse collapse" id="navbar-main" >
					<!-- nav loaded via ajax, js call at bottom of page -->

					<ul class="nav navbar-nav" >

						<li class="dropdown" >
							<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="sections" >Sections <span class="caret" ></span></a>

							<ul class="dropdown-menu" aria-labelledby="sections" >
								<li><a href="main.html" >Main</a></li>
								<li class="divider" ></li>
								<li><a href="a.html" >A</a></li>
								<li><a href="b.html" >B</a></li>
								<li><a href="c.html" >C</a></li>
							</ul>

						</li>

						<li class="dropdown" >
							<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="public" >A <span class="caret" ></span></a>

							<ul class="dropdown-menu" aria-labelledby="public" >
								<li><a href="A.1.html" >A Get Started</a></li>
								<li><a href="A.2.html" >How to A</a></li>
								<li><a href="A.4.html" >A Process</a></li>
							</ul>

						</li>


						<li class="dropdown" >
							<a class="dropdown-toggle" data-toggle="dropdown" href="#" id="owner" >B <span class="caret" ></span></a>

							<ul class="dropdown-menu" aria-labelledby="owner" >
								<li><a href="B.1.html" >B Get Started</a></li>
								<li><a href="B.2.html" >Create a B</a></li>
							</ul>

						</li>


						<li...