Tagged: , ,

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • January 19, 2016 at 12:00 am #567477
    ElizabethPeggs

    Hello. I have a WordPress site using Enfold. We have many items in our Parent navigation main menu. However, due to it’s size, the menu drops extra choices to a second line but sits exactly right on top of the Page Heading.

    How can I fix this issue where all the menu is properly showing and not interfering with the page header? Is there a limitation to number of Parent items in a menu?

    Thank you for any help you can provide.

    January 19, 2016 at 3:27 am #567531
    Elliott

    Hi ElizabethPeggs!

    I see a mega menu with three columns and that’s the only sub menu I see. Can you take a screenshot and highlight what your seeing so we can get a better idea?

    Best regards,
    Elliott

    January 19, 2016 at 3:49 pm #567873
    ElizabethPeggs

    Hello Elliot.
    Can you please show me how to attach the Screenshot here? I am not sure I am seeing the functionality for attachments.

    Thanks!

    January 19, 2016 at 3:53 pm #567878
    Yigit

    Hey!

    You can upload your screenshots on imgur.com or Dropbox public folder and post the links here

    Cheers!
    Yigit

    January 19, 2016 at 4:05 pm #567889
    ElizabethPeggs

    Hello, Yigit,

    Please see our screenshot of our nav issue. All the menu locations appear. However we have so many that some are moved to a second row below the main nav. And they are covering up the Page header. Can you please let me know how to have all the nav choices appear but not sit on top of the page header?

    Is there a limit to how many Nav parents I can have? How can I fix this issue? Thank you for any assistance you can provide.

    January 19, 2016 at 4:10 pm #567895
    Yigit

    Hi!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 1024px) {
#header_main_alternate .container {
    padding: 0;
}
.av_seperator_big_border .av-main-nav > li > a {
min-width: 50px; 
}
#top .av_seperator_big_border#header .av-main-nav > li > a {
    padding: 0 2px;
}}

    Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.

    Regards,
    Yigit

    November 24, 2016 at 11:42 am #716358
    msgraphixro

    Hello Yigit,

    Can you please find a similar fix for me. My menu is perfect on wider screens, but I have a problem on square ones.
    The last 3 buttons of my menu drop to the second row.

    November 24, 2016 at 4:14 pm #716475
    Yigit

    Hi,


    @msgraphixro     Please refer to this post – http://kriesi.at/documentation/enfold/menu-overlaps-logo-on-tablets/ and if that does not help, please see – http://kriesi.at/documentation/enfold/switching-to-mobile-menu-on-higher-resolutions/

    Best regards,
    Yigit

    January 11, 2017 at 2:50 am #731813
    ElizabethPeggs

    Hello Again. It seems the code you provided above has not solved our issue. We have since updated the site a bit since last time. Please see attached img of issues we are seeing.

    I have a WordPress site using Enfold. We have many items in our Parent navigation main menu. However, due to it’s size, when viewed on a laptop, the site places Nav that does not fit on to a second line. This is an issue as it sits exactly right on top of the Page Heading. (See attached img of issue).

    We want the Nav to wrap to a second line if needed so everything is available. But we don’t want it to sit on top of the Page Heading. (Things look okay when viewed on Mobile as it then goes to the Responsive Hamburger Menu option)

    In this string of posts, you provided some code, but it doesn’t seem to be working. Is there code I should be using instead to fix this issue?

    Thank you for any help you can provide.

    January 14, 2017 at 3:27 am #733418
    Ismael

    Hi,

    Thank you for the update. Looks like you managed to fixed it with the following css code.

    @media only screen and (max-width: 1327px) and (min-width: 990px) {
#header #header_main_alternate .container {
    max-height: none;
    height: 100px;
}
}

    Best regards,
    Ismael

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