Why aren't the links in my sidenav working?

Question

I've been working on a wordpress theme using the materializecss framework. I can't get the links in the sidenav to work, the sidenav will slide out no problem but the links don't work. Below is a link to the c9.io box.

https://loftymaterial-chubbymaus.c9users.io/

here is the code for the sidenav

 <?php wp_nav_menu( array(
     'theme_location' => 'mobilemenu',
     'menu_class' => 'side-nav',
     'menu_id' => 'nav-mobile'
      ));?>

 <a href="#" data-activates="nav-mobile" class="button-collapse"><i class="material-icons">menu</i></a>

and this is how the mobilemenu is registered

register_nav_menus( array(
    'primary' => esc_html__( 'Primary', 'loftymaterial' ),
    'mobilemenu' => __( 'Mobile Menu', 'loftymaterial' )
) );

any thoughts you have are greatly appreciated. Thanks

Answer 1

Issue is because of the #sidenav-overlay element, it is positioned on top of the side menu, use the below CSS, make sure to put it in a CSS file which loads after the materialize.css file

#sidenav-overlay{
    z-index: 996;
}