Restrict Mobile Menu to Top Level Items

  • I am designing a website using a child theme of So Simple-
    https://marilynthrall.pairserver.com/

    Unfortunately, the mobile menu is not handling secondary level items in the menu very well. It is stacking them to the lower left and it looks jumbled and confused. Reduce the browser window and click on the Primary Menu icon to see what I mean.

    How do I restrict the mobile menu to top level items only? I would prefer for the secondary items not to appear at all.

Viewing 1 replies (of 1 total)
  • Thread Starter homemadejam

    (@homemadejam)

    I figured out one solution to this, perhaps not the ideal one. I discerned the breakpoint for the mobile menu and simply disabled the display-

    @media screen and (max-width: 800px) {
.main-navigation ul ul {
    display: none;
}
}

    I’m assuming there is a better option in regards to editing the PHP itself. If anyone knows of such, feel free to chime in.

    • This reply was modified 7 years, 10 months ago by homemadejam.
Viewing 1 replies (of 1 total)
  • The topic ‘Restrict Mobile Menu to Top Level Items’ is closed to new replies.