AngularJSでデフォルトで隠されている垂直タブの内容を作る方法

Question

私はSergey RomanovのコードをAngularJSの垂直タブについて試してみました。しかし、私は質問がある、私はタブのコンテンツの幅を指定したいが、私はそれがもう動作しない、私のCSSファイルに追加したとき、コンテンツはデフォルトで登場した。手伝って頂けますか？

htmlファイル：

<div class="container"> 
     <div class="row row2" ng-controller="optionsMenu"> 
      <div class="tabbable"> 
       <ul class="nav nav-tabs nav-stacked nav-pills" role="tablist"> 
        <li ng-class="{'active': view_tab == 'tab1'}"> 
         <a class="btn-lg" ng-click="changeTab('tab1')" href=""><span class="glyphicon glyphicon-search"></span></a> 
        </li> 
        <li ng-class="{'active': view_tab == 'tab2'}"> 
         <a class="btn-lg" ng-click="changeTab('tab2')" href=""><span class="glyphicon glyphicon-share"></span></a> 
        </li> 
       </ul> 


       <div class="tab-content"> 
        <div class="tab-pane" ng-show="view_tab == 'tab1'"> 
           This is tab 1 content 
        </div> 
        <div class="tab-pane" ng-show="view_tab == 'tab2'"> 
           This is tab 2 content 
        </div> 
       </div> 
     </div> 
     </div> 
    </div> 

CSSファイル：

.tabbable{ 
    position: relative; 
    background:rgb(200,200,200); 
    padding:0; 
    width:50px; 
} 
.tab-content{ 
    position:absolute; 
    height: 100%; 
    width: 300px; 
    background-color: blue; 
    left:100%; 
    top:0; 
} 

.tabbable ul{ 
    width:100%; 
    height: 100% 
} 
.tabbable ul li{ 
    border-bottom:1px solid rgb(150,150,150); 
} 

.row2{ 
    position: absolute; 
    min-width: 350px; 
    height: 20%; 
    left: 35px; 
    top: 60px; 
} 

Thankx事前

Answer 1

ため、私は遅れてbieng用ごめんなさい。私は、ブートストラップを積み重ねたnavbarを使用して、私はちょうど私のページにそれをaddptedです。多くの試みの後、私はソリューションが複雑ではないことを理解しています:)ただ、私はタブペインの幅を指定する必要があり、タブの内容は指定しないでください。