Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #321368

    How do we center the main menu?

    I was given the CSS below, but it is unfortunately, not centered. Thank for your help!

    .av-main-nav > li > a {
    border: none!important; }

    .av-main-nav > li > a > .avia-menu-text{
    position: relative;
    }
    .av-main-nav > li > a > .avia-menu-text:after {
    content: “”;
    position: absolute;
    right: -13px;
    border-right: 1px solid #e2e2e2;
    height: 100%;
    top: 0px;
    }

    .av-main-nav > li:last-child > a > .avia-menu-text {
    border: none!important; }

    I would post on the original thread, but it was closed:
    https://kriesi.at/support/topic/enfold-menu-does-not-look-like-the-theme-settings/

    #321375

    Hi saki!

    Please choose to display – logo center, menu below in Enfold theme options > header layout and then add following code to Quick CSS in Enfold theme options under General Styling tab

    .html_header_top.html_logo_center .logo { left: 0; } 

    Cheers!
    Yigit

    #321467

    That worked great! How would I create more space between the menu items?

    Example:

    Item1 (SPACE) | (SPACE) item2 (SPACE) | (SPACE) item3

    • This reply was modified 10 years, 2 months ago by koala.
    #321531

    Hey!

    Please add following code to Quick CSS and adjust as needed

    .av-main-nav > li > a { padding: 0 25px; }

    Best regards,
    Yigit

    #322494

    Close! Please take a look at where the logo sits. I tried to put a little margin to the left of the logo, but when you scroll down it pushes the logo too far to the right.

    For the menu, It looks like that only puts padding on one side and the line below would then be offset wrong.

    • This reply was modified 10 years, 2 months ago by koala.
    #322858

    Hey!

    Please add this at the bottom of the css snippets:

    .html_header_top.html_logo_center .header-scrolled .logo {
    margin-left: 50px;
    }

    Cheers!
    Ismael

    #326620

    Update: the only remaining question is the space to the right of menu items – it’s not the same as the left.

    #327015

    Hi!

    Try modifying the following in your Quick CSS:

    .av-main-nav > li > a > .avia-menu-text:after {
      content: "";
      position: absolute;
      right: -26px;
      border-right: 1px solid #e2e2e2;
      height: 100%;
      top: 0px;
    }

    And remove this:

    .avia-menu-fx { left: -12px; }
    

    Best regards,
    Josue

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.