(+359) 88 339 4445

Buy All 39 Premium WordPress Themes for $54.99

How to Keep Submenu Items Hierarchy under Mobile

How to Keep Submenu Items Hierarchy under Mobile

By default, when you open a menu under mobile screens, all of the menu items are aligned at left. In case you want to keep the submenu items hierarchy (like the screenshot above), it will require a small code change. Here are all of the necessary steps:

  1. Admin Panel -> Left Menu -> Appearance -> Theme Editor
  2. Open style.css
  3. Under
    /* Medium Resolution */
    @media screen and (max-width: 799px) {
  4. Find the following code (about 100 lines below):
    #navmain ul {
  5. Then replace it with:
    #navmain ul {
    padding:0 0 0 25px;
  6. Save changes

That’s all. Now, when open your website under mobile screens, the submenu items hierarchy will be displayed.

About the Author

Tihomir Ivanov is a WordPress and Salesforce Commerce Cloud (SFCC) developer, founder of, a fan of Linux and Open Source, Minimalism (in Design and Life), Sci-fi, Fantasy, Classic and History books :)

Leave a Reply