Nav Stacked (Main Sub Nav Component)



<nav>
    <ul class="nav nav-stacked">
        <li class="nav-heading h5">Nav Stacked Heading</li>
        <li><a href="#">Nav Item One</a></li>
        <li class="active"><a href="#">Nav Item Two</a></li>
        <li><a href="#"><i class="fa fa-fw fa-user"></i><span>Nav Item Three</span></a></li>
        <li><a href="#"><i class="fa fa-fw fa-link"></i>Nav Item Four</a></li>
    </ul>
</nav>


Nav Tabs



<nav>
    <ul class="nav nav-tabs">
        <li role="presentation" class="active"><a href="#">Home</a></li>
        <li role="presentation"><a href="#">Profile</a></li>
        <li role="presentation"><a href="#">Messages</a></li>
    </ul>
</nav>


Nav Pills



<nav>
    <ul class="nav nav-pills">
        <li role="presentation" class="active"><a href="#">Home</a></li>
        <li role="presentation"><a href="#">Profile</a></li>
        <li role="presentation"><a href="#">Messages</a></li>
    </ul>
</nav>


Nav Pills Stacked



<nav>
    <ul class="nav nav-pills nav-stacked">
        <li role="presentation" class="active"><a href="#">Home</a></li>
        <li role="presentation"><a href="#">Profile</a></li>
        <li role="presentation"><a href="#">Messages</a></li>
    </ul>
</nav>


Nav Tabs Justified



<nav>
    <ul class="nav nav-tabs nav-justified">
        <li role="presentation" class="active"><a href="#">Home</a></li>
        <li role="presentation"><a href="#">Profile</a></li>
        <li role="presentation"><a href="#">Messages</a></li>
    </ul>
</nav>


Nav Pills Justified



<nav>
    <ul class="nav nav-pills nav-justified">
        <li role="presentation" class="active"><a href="#">Home</a></li>
        <li role="presentation"><a href="#">Profile</a></li>
        <li role="presentation"><a href="#">Messages</a></li>
    </ul>
</nav>