Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 23, 2022 at 3:52 pm #1352646
    thinkjarvis

    Hi Guys,

    See example sites in Private content

    When you have a mega menu towards the right side of the page the offset is incorrect in the current version of Enfold.

    Please can you take a look at the examples in private content and advise?

    I think this is a bug with Enfold vs my modifications – I didnt want to make css changes to fix without checking with support first.

    • This topic was modified 2 years, 6 months ago by thinkjarvis.
    May 24, 2022 at 6:55 am #1352715
    Ismael

    Hey Thomas,

    Thank you for the inquiry.

    Which mega menu items have this issue? We have checked the sites but we cannot see any issues with the menu items mentioned above.

    If the mega menu container is a little bit further to the right than where you want it to be, you can pull the container a bit to the left with css.

    Example:

    #header #menu-item-4249 .avia_mega_div {
    left: -300px;
}

    This should adjust the position of the mega menu container under the Order Online menu item.

    Best regards,
    Ismael

    May 24, 2022 at 10:12 am #1352736
    thinkjarvis

    Hi Ismael,
    Thanks for taking a look. I have screenshot the issue and highlighted the automated code that is causing the issue.

    Its affecting every site that has a mega menu when ran on a standard 1920px wide monitor. But the break point where the problem occurs varies depending on the length of the menu. It is auto-calculating an offset somewhere but it is getting it wrong.
    When you jump down to 720p (1366px) it is fine. It is just HD desktops.

    This did not occur until one of the 3 latest versions of Enfold. I think it was 4.9.2.1 where this first started happening.

    Take a look at the screen shots and let me know what you think.

    May 24, 2022 at 10:26 am #1352737
    thinkjarvis

    I can see the problem.

    It thinks the menu is a six column and a three column when they are infact two columns and one columns. You can see it in the screenshots in the previous post.

    It automatically sets an offset based on what I assume is how close the item is to the edge of the screen to prevent it shooting off:

    All of the mega menus are Right aligned by default. So I have changed the ones causing problems to left aligned using the following code:

    I must add, this wont work on smaller screens – So must be media query driven. Otherwise a wide menu will shoot off the page to the right.

    @media screen and (min-width:1441px) {
#header #menu-item-87 .avia_mega_div {
    left: 0px !important;
    right: auto !important;
}
}
    • This reply was modified 2 years, 6 months ago by thinkjarvis.
    May 25, 2022 at 1:30 pm #1352922
    Ismael

    Hi!

    Thank you for the info.

    We tried to copy the mega menu setup in our local installation but we are not able to reproduce the issue. Can we have access to the site? We may need to actually see the menu setup in order to replicate the issue.

    Cheers!
    Ismael

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