Twenty Twelve Navigation Bar

• 

  alyssarleneevents · Member · Oct 3, 2012 at 5:10 am

  • Copy link
  • Add topic to favorites

  I would like to know how to center my navigation bar in the twenty twelve theme.
  Blog url: http://alyssarleneevents.wordpress.com/

  The blog I need help with is: (visible only to logged in users)

• 

  designsimply · Member · Oct 10, 2012 at 9:10 pm

  • Copy link

  Looks like you added some CSS for that. I think this might be better:

  Try removing this:

  .main-navigation {
  	margin-left:50px;
  	margin-left:8.2rem;
  }
  
  .main-navigation {
  	margin-top:18px;
  	margin-top:.8rem;
  	text-align:center;
  }

  And add this instead:

  .main-navigation {
  	position: relative;
  }
  .main-navigation div {
  	display: inline-block;
  	margin: 0 auto;
  	margin-right: -40px;
  }
  .main-navigation ul.nav-menu,
  .main-navigation div.nav-menu > ul {
  	border: none;
  }

  Note that you will probably need to adjust a little bit of the spacing after that change. Update the numbers until you find a look that you like.