Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • June 5, 2017 at 5:20 pm #804054
    varshabi

    I need help in centering my menu text as well as customizing the separators between them. It currently says I’m using large separators but as you can see, they’re not showing up at all. I’d like to be able to edit the color as well.

    Thanks!
    Menu help

    June 5, 2017 at 7:34 pm #804107
    varshabi

    I will say that I tried this code:

    .html_header_top.html_logo_center .main_menu ul:first-child {
    width: 100%;
    }
    .av-main-nav > li {
    width: 16%;
    }

    Unfortunately, it pushed one of my long titles to a 2nd line which is now off of the menu bar completely. Any ideas?

    June 6, 2017 at 6:34 am #804315
    Rikard

    Hi,

    Could you post a link to the site in question so that we can take a closer look please?

    Best regards,
    Rikard

    June 6, 2017 at 3:55 pm #804545
    varshabi

    Thanks Rikard – Here’s the link!

    June 7, 2017 at 7:08 am #804864
    Rikard

    Hi,

    Thanks for that, though I’m not sure I understand what you are looking to achieve, could you post a screenshot with your desired results maybe? If you are looking to have the menu centered then I think it will be difficult since you will have to set the width of each menu item individually. That will likely cause you problems in the future as well if you need to add/remove menu items.

    Best regards,
    Rikard

    June 7, 2017 at 4:30 pm #805139
    varshabi

    Sure. So my current menu bar is centered, which I’m fine with. The only concern is that the “Global Challenges & Mega Trends” section, is being pushed into 2 lines where the 2nd part (the words “Mega Trends”) is not displaying on the actual menu.

    Similarly, I want to use separators in the menu but while they are turned on, they’re not showing up. They aren’t even showing up when I don’t use the code to center the menu.

    I’m attaching a photo to show what I mean.

    menu
    http://tinypic.com/r/1zzjpjo/9

    • This reply was modified 7 years, 6 months ago by varshabi.
    June 9, 2017 at 6:54 am #805873
    Rikard

    Hi,

    Ok, thanks for the feedback. Let’s try to fix the first problem first, please try this in Quick CSS to remove the padding from the menu items:

    .av-main-nav > li > a {
    padding: 0 !important;
}

    Best regards,
    Rikard

    June 9, 2017 at 3:28 pm #806102
    varshabi

    It moved the word “Mega” but “Trends” is still off the menu.

    June 11, 2017 at 9:25 pm #806656
    varshabi

    Hi Rikard,

    Any other suggestions on how to solve this? Thanks!

    June 13, 2017 at 11:05 am #807356
    Victoria

    Hi varshabi,

    IS that what you were aiming for? Or is there still something to be fixed?

    Best regards,
    Victoria

    June 13, 2017 at 5:36 pm #807583
    varshabi

    Yes, I managed to fix it with some coding trial and error, thanks! You can close this.

    June 14, 2017 at 7:20 am #807809
    Rikard

    Hi,

    Great, thanks for letting us know. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Centering Menu Text & Editing separator between menu items’ is closed to new replies.