Menu sub-items not showing on mobile (understrap theme)

Question

I'm building a website using understrap-child theme.

I've got a navbar with a lot of items and sub-items (up to three levels). I've set the navbar depht to 0 since, according to the documentation, it should allow all the sub items to show in the menu.

<!-- The WordPress Menu goes here -->
                <?php wp_nav_menu(
                    array(
                        'theme_location'  => 'primary',
                        'container_class' => 'collapse navbar-collapse',
                        'container_id'    => 'navbarNavDropdown',
                        'menu_class'      => 'navbar-nav ml-auto',
                        'fallback_cb'     => '',
                        'menu_id'         => 'main-menu',
                        'depth'           => 0,
                        'walker'          => new Understrap_WP_Bootstrap_Navwalker(),
                    )
                ); ?>

It seems to be working fine on the desktop version, but once I switch to mobile, I am only able to see the first sub-items and not all those that come after that. E.g. ABOUT (first item) --> ABOUT US (sub item) --> OUR ALLIANCES (sub-sub-item). in the mobile version nothing shows after "ABOUT US". Is there a way to solve this problem?

Any suggestion would be really appreciated!

THANK YOU!

Answer 1

try to put depth => 2 instead of 0. may be then your problem will be solved.