SlikNav multi-level menu on desktop view?

Question

I'm using SlikNav to make a mobile navigation menu. I have this structure:

<nav>
    <ul>
        <li>
            <a href="#">Home</a>
        </li>
        <li>
            <a href="#">Products</a>
            <ul>
                <li>
                    <a href="#">Child1</a>
                </li>
                <li>
                    <a href="#">Child2</a>
                </li>
            </ul>
        </li>
    </ul>
</nav>

This works fine on mobile view, here is a codepen.

My desktop version of this is simply: nav ul li { display:inline; } which makes the list display inline.

My question, is it possible for SlickNav to make the dropdown menu also work in desktop view?

Answer 1

right now, the menu is already a dropdown in desktop mode and also in mobile mode..

Just for looks good, do that - add a class "sub" in ul after li.

<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a>
      <ul class="sub">
        <li><a href="#">Child1</a></li>
        <li><a href="#">Child2</a></li>
      </ul>
    </li>
  </ul>
</nav>

and css -

li{
  float: left;
}
li > ul.sub{
  margin: 0;
}

Answer 2

I don't know how to do this but I have an alternative and fast solution from this.

You can use smartmenu Plugin Here is the Example Click Here

Hope It Helps You.