3

new to Bootstrap, following this question almost exactly, and can't seem to make my pills/tabs center?

</head> <body>
    <div class="container">
      <ul class="nav nav-pills">
        <li><a href="#home" data-toggle="tab">Home</a></li>
        <li><a href="#profile" data-toggle="tab">Profile</a></li>
        <li><a href="#messages" data-toggle="tab">Messages</a></li>
        <li><a href="#settings" data-toggle="tab">Settings</a></li>
      </ul>
    </div>
<html> 


.nav-tabs > li, .nav-pills > li {
    float:none;
    display:inline-block;
    *display:inline; /* ie7 fix */
     zoom:1; /* hasLayout ie7 trigger */
}

.nav-pills {
    text-align:center;
}

I have the CSS in a file called style.css, and I am importing as such

<link href="style.css" rel="stylesheet" type = "text/css">

Both files are within the bootstrap folder, so not really sure what's going on

Florent
  • 12,310
  • 10
  • 49
  • 58
zhuyxn
  • 6,671
  • 9
  • 38
  • 44
  • http://jsbin.com/axizic/1 looks OK to me. You sure you don't have other styles conflicting with it? – sachleen Sep 15 '12 at 05:04
  • Oh shoot, it was conflicting with ``, what is the difference between that and ``? The first one when commented out fixes the issue, the second works regardless? – zhuyxn Sep 15 '12 at 05:22
  • both should work. the order in which you include styles matters. – sachleen Sep 15 '12 at 17:12
  • possible duplicate of [Twitter Bootstrap: Center Pills](http://stackoverflow.com/questions/7165423/twitter-bootstrap-center-pills) – Marijn Mar 18 '14 at 09:53

1 Answers1

4

You need to override the .nav-pills css classes defined by bootstrap (as you are already doing). You should update the margin and the specify a width for the element.

.nav-pills {
    margin: 0 auto;
    padding: 0;
    width: 400px;
}
John Dyer
  • 1,221
  • 1
  • 9
  • 13
  • If you don't want to use With Attribute, this approach is more elegant, http://stackoverflow.com/questions/9421966/how-do-i-center-the-twitter-bootstrap-tabs-on-the-page – Ali Salehi Jun 01 '13 at 02:57