Site logo

Archived topic

mega menu in 2 columns

5 replies · Started by John MacKenzie on September 19, 2019

Viewing posts 1–6 of 6

Hi there,

I don't see a mega menu currently.

Can you add it in so we can try to provide some CSS?

Let me know :)

sorry i forgot i had taken it off, its on now

John

Hi there,

so couple of edits to the Mega menu CSS:

Change:

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

to:

nav .main-nav .mega-menu > ul {
    position: absolute;
    width: auto;
    left: 0 !important;
    display: grid;
    grid-template-columns: 50% 50%;
}

And change:

nav .main-nav .mega-menu>ul>li {
    display: inline-block;
    width: 25%;
    vertical-align: top;
}

to:

nav .main-nav .mega-menu>ul>li {
    display: inline-block;
    width: auto;
    min-width: 250px; /* adjust this to suit */
    vertical-align: top;
}

awesome thanks!

You're welcome

This archived topic is closed to new replies.