how to keep navbar from shifting on window resize?

Question

How can i keep everything on the page the way it is so when window is resized nothing moves and just a scroller appears. I am using twitter bootstrap.

   <div class="container">
  <div class="text-center">
     <ul class="nav nav-pills" role="tablist">
      <li role="presentation" class="active"><a href="#">Home</a></li>
      <li role="presentation"><a href="#">TierList</a></li>
      <li role="presentation"><a href="#">Tournaments</a></li>
      <li role="presentation"><a href="#">Team Maker</a></li>
      <li role="presentation"><a href="#">Counters</a></li>
      <li role="presentation"><a href="#">Builds</a></li>          
      <li role="presentation"><a href="#">Forum</a></li>
      <li role="presentation"><a href="#">Contact Us</a></li>
    </ul>
  </div>

Answer 1

Just give .container element fixed width:

.container {
    width: 900px;
}

Demo: http://plnkr.co/edit/3QLf5ThO7lwLdfQQCbuH?p=preview