Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 1, 2017 at 2:45 pm #741253
    jgoldstein

    Hi,

    I asked this question on another post, but it needed its own, so this is branching off of my other post.

    Is there a way I can raise the menu links up a bit so they aren’t so far down? I wanted to make my logo bigger, however when I increase the size of this section, it keeps the links vertically centered so they look oddly far down. How could I adjust this?

    The solution provided was:

    5. Feel free to make the logo as big as you like and add the below code to push the main menu up. Adjust the margin top value if you like to adjust the vertical position of the menu.
    .main_menu {
    margin-top: -55px;
    }

    It looks perfect, but the problem is, it affects the sticky menu.(see images linked in the private content). It also messes up the mobile menu. How can I get it to ONLY adjust the desktop non-stickied menu?

    I removed the fix from the custom CSS for now.

    Thanks for your help!

    February 6, 2017 at 5:49 am #743140
    Nikko

    Hey jgoldstein,

    Sorry for the delayed response, however when viewing the links you posted it shows this:

    Nothing Found
Sorry, the post you are looking for is not available. Maybe you want to perform a search?

    Best regards,
    Nikko

    February 6, 2017 at 4:49 pm #743452
    jgoldstein

    Hi Nikko,

    I had to close down the staging area so I could make the site live and didn’t have a chance to update this post. The site is now at http://www.pulsepilates.net/

    Is there a different menu class for the sticky mode menu and the non-sticky menu? I only want to adjust the position of the non-sticky menu.

    Thanks for your assistance.

    Jenna

    February 6, 2017 at 8:43 pm #743579
    Nikko

    Hi Jenna,

    Try using this css code:

    @media only screen and (min-width:768px) {
  .main_menu {
    margin-top: -55px;
  }

  .header-scrolled .main_menu {
    margin-top: 0;
  }
}

    the media only screen part makes sure it won’t affect the mobile devices, the first block of code (the code given to you before) affects all menus, then the 2nd block of code makes sure that the sticky menu will have it’s top margin back to 0. Hope the code and explanation helps. Just adjust it as you see fit :)

    Cheers!
    Nikko

    February 6, 2017 at 8:58 pm #743600
    jgoldstein

    Perfect!! Thank you so much!

    February 7, 2017 at 4:53 am #743663
    Nikko

    Hey,

    Glad we could help :)

    Regards,
    Nikko

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Menu Height’ is closed to new replies.