bootstrap nav-stacked-tab with multiple collapse

Question

hi guys i want to make a vertical nav-tab with nested sub nav-tab i used a sample code from stackoverflow here is jsfiddle but i need somthing more complex i try but did not get what i want below is the scree shot what i exactly want if any one have idea on it please provide me some suggestion it should be on bootstrap 2.3

below is code

<div class="row">
    <div class="span4">
        <div class="side-nav-container affix-top">
            <ul class="nav nav-tabs nav-stacked">                                
                <li class="active"><a data-toggle="tab" href="#Tab2">Tab2</a>

                </li>
                <li><a data-toggle="tab" href="#Tab3">Tab3</a>

                </li>
                <li><a data-toggle="tab" href="#Tab4">Tab4</a>

                </li>
                <li> <a data-toggle="collapse" href="#Tab1">Tab1</a>

                    <ul class="subnav nav nav-tabs nav-stacked collapse" id="Tab1">
                        <li><a class="subnavtab" data-toggle="tab" href="#Subtab1">Subtab1</a>
                            <ul class="subnav nav nav-tabs nav-stacked collapse" id="Tab1">
                                <li><a class="supersub" data-toggle="tab" href="#Subtab1">My Super Sub</a></li>
                            </ul>

                        </li>
                        <li><a class="subnavtab" data-toggle="tab" href="#Subtab2">Subtab2</a>

                        </li>
                        <li><a class="subnavtab" data-toggle="tab" href="#Subtab3">Subtab3</a>

                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
    <div class="span8">
        <div class="tab-content">
            <div class="tab-pane fade active" id="Tab2">Content 2</div>
            <div class="tab-pane fade" id="Tab3">Content 3</div>
            <div class="tab-pane fade" id="Tab4">Content 4</div>
            <div class="tab-pane fade" id="Subtab1">Content 1a</div>
            <div class="tab-pane fade" id="Subtab2">Content 1b</div>
            <div class="tab-pane fade" id="Subtab3">Content 1c</div>            
        </div>
    </div>
</div>

Answer 1

You can do something like this:

    .nav-tabs > li li {
        margin-left: 60px;
    }

That'll do the trick. http://jsfiddle.net/gqfhZ/