title: Bootstrap Responsive Menubar Issue
body: <p>I have been trying to develop a menubar for bootstrap in which the image logo be centerized instead to the usual left of the bar. But the problem is, the right links of the menu bar goes off screen. When I preview the page with a width greater than 2050 pixels, it looks fine.
  <a href="https://i.stack.imgur.com/jAZeT.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jAZeT.png" alt="Greater than 2050px width - dreamweaver"></a></p>
  
  <p>But when I have something smaller than that, the right links didn't respond to the window change and slid off the page.
  <a href="https://i.stack.imgur.com/DCmCU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DCmCU.png" alt="Size of 1780px width produces this result - dreamweaver"></a></p>
  
  <p>Is there any way to fix this? I have been playing around with the <code>col-md-7</code> and the <code>col-md-offset-3</code> class of the <code>nav</code>. But it didn't fix the problem, just moves/resizes it around the top.</p>
  
  <p>Here is the link to the snipp of the page. <a href="http://bootsnipp.com/snippets/rvGQz" rel="nofollow noreferrer">http://bootsnipp.com/snippets/rvGQz</a></p>