Spacing in Menu

• 

  familyhealingbroward · Member · Aug 22, 2016 at 6:12 pm

  • Copy link
  • Add topic to favorites

  I am trying to create a little extra space at the top of my page to get the menu to all fit on one line. Can anybody help?

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

• 

  jenbhughs · Member · Aug 22, 2016 at 9:33 pm

  • Copy link

  Would like to know the css for this as well.

• 

  thesacredpath · Member · Aug 23, 2016 at 6:39 pm

  • Copy link

  @familyhealingbroward, on Karuna, the size of the logo determines how much room there is for the menu. Menu spacing can be tightened up a bit, and left margin removed from the menu to make a bit more room, but we are also dealing with a responsive designed theme, so whether or not a visitor is going to see one line, or two on the menu, even after the following change, depends on how wide they have their browser window set.

  .main-navigation {
      margin-left: 0;
  }
  .main-navigation a {
      padding-left: 1.5em;
  }

  Alternately, we could increase the width of the div that contains the logo and menu, which is currently set to the same max width of the content area so that it aligns with it.

  .site-branding-wrapper {
      box-sizing: border-box;
      max-width: 1240px;
  }

  @jenbhughs, since your logo is a different size, adjustments may have to be made to the above code in order for it to work on your site.