[Support request] Mobile version not displaying submenus

[Margot]

Not sure how it got this way but my website is not displaying the submenus on mobile. I would like to be able to have them visible on mobile. Is this possible?

[Leo]

Hi there,

It’s hidden by this CSS you’ve added:

.menu-item-has-children .dropdown-menu-toggle {
    display: none;
}

I’m guessing you want to make them, and lots other navigation CSS desktop only:
https://docs.generatepress.com/article/responsive-display/

[Margot]

I see. I set it to that for the regular desktop view because I don’t want to see the down arrow on desktop. But I want to see the arrow and drop down on mobile view (which doesn’t show up). What is the display supposed to be set at for mobile? Is it block?

[Leo]

Just wrap everything you only want on desktop with media quarry as the linked I provided above:

@media (min-width: 1025px) {
    /* CSS in here for desktop only */
}

[Margot]

Gotcha. That works!

[Leo]

No problem 🙂

[Author]

Posts