0

Below is how my navbar looks like at the moment :

enter image description here

  <nav class="navbar-default navbar-static-side new-dash-bg" role="navigation">
    <div class="sidebar-collapse">
        <ul class="nav new-dash-bg" id="side-menu">
            <li class="nav-header new-dash-bg">
                <div class="dropdown profile-element">
                    <a data-toggle="dropdown" class="dropdown-toggle" href="#">
                        <span class="clear"> <span class="block m-t-md"> <strong class="font-bold">Dashboard</strong>
                         </span> 
                </div>
                <div class="logo-element">
                    CTRL+
                </div>
            </li>
            <li class="active">
                <a href="index.html"><i class="fa fa-th-large"></i> <span class="nav-label">MANAGE</span> <span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li><a id="serv-feed" href="#">Services</a></li>
                    <li><a id="activity-feed" href="#">Activity Feed</a></li>
                </ul>
            </li>

            <li>
                <a href="#"><i class="fa fa-info-circle"></i> <span class="nav-label">SUPPORT</span><span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li><a href="#">Guideline</a></li>
                    <li><a href="#">Q &amp; A</a></li>

                </ul>
            </li>

            <li>
                <a href="#"><i class="fa fa-cog"></i> <span class="nav-label">ACCOUNT</span><span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li><a href="#">Company</a></li>
                    <li><a href="#">Products</a></li>
                    <li><a href="#">Billings &amp; Payment</a></li>
                    <li><a href="#">Settings</a></li>
                </ul>
            </li>

        </ul>

    </div>
</nav>

How can I make sure that on desktop screens and above, the second level menu are not collapsed? So to have them expanded on desktop.

rory-h
  • 660
  • 1
  • 12
  • 30

1 Answers1

0

Bootstrap has two class's collapse and navbar-collapse

<div class="collapse navbar-collapse">
   <ul>
    .............
    .............
   </ul>
</div>
Alimon Karim
  • 4,354
  • 10
  • 43
  • 68