Can I center navigation bar menu items?

• 

  maraeastern · Member · Apr 14, 2014 at 1:43 pm

  • Copy link
  • Add topic to favorites

  Hi all, I can’t figure out if there’s a bit of CSS that would center my navigation bar menu items. The idea is that my blog title and tagline are centered, so that the menu items would be centered too. If you need more details, I’ll happily provide them. Thanks for any help!

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

• 

  thesacredpath · Member · Apr 14, 2014 at 7:13 pm

  • Copy link

  Hi, the following will center the menu above 600px in width when the minified menu comes into play. Note that once the menu goes to two lines (due to narrower browser/screen width), the centering is defeated.

  @media screen and (min-width: 601px) {
  .main-navigation {
      text-align: center;
  }
  .main-navigation ul {
      display: inline-block;
  }
  }

• 

  maraeastern · Member · Apr 15, 2014 at 7:48 am

  • Copy link

  Thank you a lot, it works!

  One more quick question: when I write too much CSS for the blog, does it mean that the loading of the blog will be slowed down? Sorry if it’s a silly question… I’ve got about 100 lines of CSS now and I wonder if I’m not overdoing it.

• 

  thesacredpath · Member · Apr 15, 2014 at 4:56 pm

  • Copy link

  The CSS file is tiny compared to images and such, so no, 100 lines or so will not slow things down.

  And you are welcome.

• 

  maraeastern · Member · Apr 15, 2014 at 4:58 pm

  • Copy link

  Perfect! Thank you very much and nice day to you!

• 

  thesacredpath · Member · Apr 15, 2014 at 5:00 pm

  • Copy link

  The CSS file is tiny compared to images and such, so no, 100 lines or so will not slow things down. Also, the WordPress.com software compressed your CSS file and takes out all spaces and blank lines and such, so it ends up way smaller than you would think from looking at it in the CSS editor window.

  And you are welcome.