Suppose we have the following markup for navigation bar using Twitter Bootstrap 2.0.
-
To align it in the center with a dynamic width, I used the following:
HTML:
CSS:
.navbar .navbar-inner {
text-align: center;
}
.navbar .navbar-inner .nav {
float: none;
display:inline-block;
}
Didn't test it, but I guess only display:inline-block; could be a problem, which is supported in all browsers except for IE7 and lower..
http://caniuse.com/inline-block