[Support request] How to remain the container of the submenu in a Megamenu full width

Home Forums Support How to remain the container of the submenu in a Megamenu full width

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1352600
    Erwin

    Hi David,

    With you help in this topic:
    https://generatepress.com/forums/topic/need-mega-menu-full-width/

    I could make my megamenu full width. Now I am looking for a solution to remain the container of the submenu at 1100px.

    #1352821
    David
    Staff
    Customer Support

    Hi there,

    now i remember.

    Change this CSS:

    nav .main-nav .mega-menu > ul {
        position: absolute;
        width: 100%;
        float: left;
        left: 0 !important;
        padding: 30px 0;
    }

    for:

    nav .main-nav .mega-menu > ul {
        position: absolute;
        width: 100%;
        float: left;
        left: 0 !important;
        padding: 30px 0;
        display: flex;
        justify-content: center;
    }

    Now we need to set a max width on each of the sub menus.
    Change this CSS:

    nav .main-nav .mega-menu.mega-menu-col-3 > ul > li {
        width: 33.3333%;
    }

    for:

    nav .main-nav .mega-menu.mega-menu-col-3 > ul > li {
        width: 33.3333%;
        max-width: 380px;
    }

    The max-width: 380px; was calculated by dividing the total width of the navigation: 1140px by 3.

    You can apply the same logic to any other mega menu column width.

    #1352855
    Erwin

    Thank you so much David! It worked, you are the best!

    #1353395
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.