Bootstrap nav - оставайтесь развернутыми, когда на рабочем столе и складными на мобильном

Вот как выглядит мой navbar на данный момент:

  <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>

Как я могу убедиться, что на экранах рабочего стола и выше меню второго уровня не свернуто? Таким образом, чтобы их развернуть на рабочем столе.

1 ответ

Bootstrap имеет два класса collapse а также navbar-collapse

<div class="collapse navbar-collapse">
   <ul>
    .............
    .............
   </ul>
</div>
Другие вопросы по тегам