Site logo

Archived topic

Creating a side by side layout (sub-menu)

1 reply · Started by Kevin on May 19, 2019

Viewing posts 1–2 of 2

I have a lot of reviews on my website, Mattressdealsonline.com

If you notice the "Mattress" page in the menu, when it opens all of my results drop straight down. Since there is over 20 results, it doesn't show them all.

How would I change the layout where the drop down appears in more than one column, side by side?

I appreciate everyones help!

Hi there,

try this CSS:

@media (min-width: 768px) {
    .main-navigation ul li:first-child ul {
        column-count: 2;
        width: 600px !important;
    }
    .main-navigation ul ul li {
        -webkit-column-break-inside: avoid;
        page-break-inside: avoid;
        break-inside: avoid;
    }
}
This archived topic is closed to new replies.