[Resolved] Need some help customizing my mobile menu

[Mike]

So, my mobile menu has 4 links, 3 of which have have sub-items.

Whenever someone clicks on the menu, I want those 3 links to automatically expand. (But only the first level should expend automatically).

for example;

home
parent1
parent2
parent3

would become:

home
parent1
child1
child2
parent2
child1
child2
parent3
child1
child2

also, I want any submenu to be indented.

for ex:

home
parent1
……child1
…………child1
…………child2
……child2
parent2
……child1
……child2
parent3
……child1
……child2

Thank you in advance!!

[Mike]

I have opened a thread for the first problem.

Solution for the second problem:

For submenus 1 level deep:

@media (max-width: 768px) {
.main-navigation .main-nav ul ul li a {
padding-left: 50px;
}
}

For submenus 2 levels deep:

@media (max-width: 768px) {
.main-navigation .main-nav ul ul ul li a {
padding-left: 80px;
}
}

and so on.

[Leo]

Glad you’ve figured out 🙂

[Author]

Posts