title: How do I center the twitter bootstrap tabs on the page?
body: <p>I'm using twitter bootstrap to create togglable tabs.  Here is the css I'm using:</p>
  
  <pre><code>&lt;div class="container"&gt;
    &lt;ul class="nav nav-tabs"&gt;
      &lt;li&gt;&lt;a href="#home" data-toggle="tab"&gt;Home&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#profile" data-toggle="tab"&gt;Profile&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#messages" data-toggle="tab"&gt;Messages&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#settings" data-toggle="tab"&gt;Settings&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This html displays the tabs correctly, but pulled to the left (which is what is supposed to happen).  I've tried tinkering with the CSS to get the tabs to center on the page, but no luck yet.  I thought someone with more css experience would know how to do this.</p>
  
  <p>As a note, there is another question about centering nav pills, which I tried, but it didn't work with just plain nav tabs.</p>
  
  <p>Thanks.</p>