Centre align menu

[ani7ruddha]

I have lost it the traditional way to centre align is not working
{
display:block;
margin:0 auto;
}

http://goo.gl/WOyzIq

[Krish1980]

You’ve given a float:left to the ul and lis. Floats will not center your navigation. Remove the float from the ul and lis, give the li display:inline-block, and give the property ‘Text-align:center’ to the ul.

http://csswizardry.com/2011/01/create-a-centred-horizontal-navigation/

[robetnobe]

try this

.navbar .nav,
.navbar .nav > li {
  float:none;
  display:inline-block;
  *display:inline; /* ie7 fix */
  *zoom:1; /* hasLayout ie7 trigger */
  vertical-align: top;
}

.navbar-inner {
  text-align:center;
}

hi try adding css code like this to your site footer

.f_nav {
  width:90% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-top: 4%;
  padding-bottom: 4%;
  display:block;
  font-size:14px
  line-height:20px
  font-weight:normal
  text-transform:uppercase
  color:#d7d7d7
  text-decoration:none
}

.f_nav ul {
  margin:0;
  padding:0;
  text-align:center;
}
.f_nav ul li {
  display:inline;
}
.f_nav ul li a {
  float:none;
  display:inline-block;
}

[ani7ruddha]

Yes done that but how to counter navbar.less ?

http://screencast.com/t/sipYaqt2w7

cant edit things their

[Paulie_D]

Can you not edit the media query?

[ani7ruddha]

Their is no file as sch navbar.less in path shown and hence cant edit it.

[Paulie_D]

No…you’d have to edit the LESS file and re-compile the CSS…wouldn’t you?

[robetnobe]

you just edit in bootstrap.css

look at this
center menu

[Author]

Posts