>IMO, find a different way. Nested tabs tend to be confusing to the user.
>
>But is should work as long as you have different IDs for the elements needed.
>
>
>
>Craig
>

This (just with few spaces characters) seems to give me the appearance I want. I just wish I can figure out how to hide these two li elements when the invoice tab is not active and only show them when it's active. But I don't see a way using #href we currently use. Does anyone see a way (using angularJs):

<div class="col-lg-3 col-md-3 panel-container">
                        <ul class="nav nav-pills nav-stacked">
                            <li class="active"><a data-toggle="pill" href="#general" ng-class="{true: 'invalid-tab', false: ''}[form.editAccountGeneral.$invalid]">General</a></li>
                            <li><a data-toggle="pill" href="#contact" ng-class="{true: 'invalid-tab', false: ''}[form.editContactForm.$invalid]">Contact</a></li>
                            <li><a data-toggle="pill" href="#invoices">Invoices</a></li>
                            @*<li class="dropdown">
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#i">
                                      <span class="caret"></span>
                                </a>
                                <ul class="dropdown-menu" role="menu">*@
                                    <li><a data-toggle="pill" href="#payInvoices" ng-class="{true: 'invalid-tab', false: ''}[form.payInvoices.$invalid]">    Pay Invoices</a></li>
                                    <li><a data-toggle="pill" href="#applyFees" ng-class="{true: 'invalid-tab', false: ''}[form.applyFees.$invalid]">    Apply Fees</a></li>
                                @*</ul>
                            </li>*@                           
                            <li><a data-toggle="pill" href="#userDefined" ng-class="{true: 'invalid-tab', false: ''}[form.editAccountUserDefinedForm.$invalid]">User Defined</a></li>
                            <li><a data-toggle="pill" href="#security" ng-class="{true: 'invalid-tab', false: ''}[form.editAccountSecurityForm.$invalid]">Security Restrictions</a></li>
                            </ul>
                    </div>