Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #214797

    Hi,
    I´ ve searching around using fierbugs on how to align the mega menu submenu exactly with the main header subtle line. Can be found on http://www.musikzentrale.net, hover MUSIKUNTERRICHT or MUSIKZENTRALE. The submenu is slightly above the light grey line. Searching for some time does make one blind for the solution, so if someone kindly point me to the regarding CSS part? Thanks!

    Have a great weekend,
    Sebastian.

    #214818

    Hey Sebastian!

    I guess you have already figured it out! If not, please post a screenshot. I could not see a light grey line

    Cheers!
    Yigit

    #214822

    Hey Yigit,
    thanks for coming back. Not quite:

    There is a thin, lightgrey line underneath the first level menu items. Hovering this, the submenu appears, and its white box overlapps the grey line just by some 3-5px. I would like to the submenu box aligned to the grey line. I do not even know where to make it move anywhere ;-)

    cheers, sebastian

    #214915

    Hey!

    You can add this on Quick CSS:

    #header .avia_mega_div {
    margin-top: 1px;
    }

    Best regards,
    Ismael

    #214919

    Hi Ismael,
    thanks for your answer, but this did not solve the problem – yet ,-)

    Please see the attached image: the thin orange line (not contained on the site, i just draw the line for demo purposes) marks the upper border of the submenu div. this container should move about 5px downwards to align with the thin grey line, which is supposedly the bottom-border of .header-main?

    Sub Menu Div alignment

    the CSS you mentioned did not show any result, even if i set it to 100px.

    Any other idea?

    Thank you,
    Sebastian.

    • This reply was modified 10 months ago by  mirzepapa.
    #214959

    Hey!

    This code should move the mega menu downwards:

    #header .avia_mega_div {
    margin-top: 100px !important;
    }

    This is the screenshot:

    Adjust the top margin to 1px. Remove browser cache then reload the page.

    Best regards,
    Ismael

    #214990

    Hi Ismael,
    thanks for pointing me to the respective part of the code.
    I set it up with the CSS snippet from above in the custom.css, playing around with pxs to adjust the container along the line, but did not look that great as expected. So i deleted the snippet, but now the submenu is about 100px underneath the main menu. I have removed browser cache at least 50 times now, but the submenu will not move back to the top.

    Is there a conflict with another part in the custom.css, defining the mega_div?

    #header .avia_mega_div {
      box-shadow: 0 30px 60px rgba(0, 0, 0, 0.1);
      display: none;
      margin: -6px 0 0;
      overflow: hidden;
      padding: 5px 0 0;
      position: absolute;
      right: 0;
      top: 100%;
      z-index: 2;
    }

    A confused Sebastian.

    #215200

    Hi!

    The menu looks normal on my end. Do you have a cache plugin? Please turn if off if you’re modifying the layout of the site.

    Regards,
    Ismael

    #215250

    ups, thanks Ismael, that did the trick ;-)
    thread can be closed.

    Regards, Sebastian

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Position Mega Menu Submenu’ is closed to new replies.