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

    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, 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,


    Hey Sebastian!

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



    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



    You can add this on Quick CSS:

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

    Best regards,


    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,

    • This reply was modified 3 years, 8 months ago by  mirzepapa.


    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,


    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.



    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.



    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.