Bootstrap 3 Свернуть в портлете с вкладками не отображается

Question

У меня есть портлет с 2 вкладками. Когда я добавляю команду коллапса, появляется значок коллапса, но вкладки находятся поверх него, поэтому к нему нельзя получить доступ.

Как сделать коллапс рядом с вкладками, чтобы портлет мог свернуть?

<div class="col-md-6 "> 
    <div class="portlet box grey tabbable"> 
     <div class="portlet-title"> 
      <div class="caption"> 
       <i class="fa fa-reorder"></i>Contact 
      </div> 
      <div class="tools"> 
       <a href="javascript:;" class="collapse"></a> 
      </div> 
     </div> 
     <div class="portlet-body"> 
      <div class="tabbable portlet-tabs"> 
       <ul class="nav nav-tabs"> 
        <li> 
         <a href="#portlet_tab2" data-toggle="tab">Secondary</a> 
        </li> 
        <li class="active"> 
         <a href="#portlet_tab1" data-toggle="tab">Primary</a> 
        </li> 

       </ul> 
       <div class="tab-content"> 
        <!-- TAB 1 --> 
        <div class="tab-pane active" id="portlet_tab1"> 

Answer 1

Все, что необходимо здесь, чтобы переместить контейнер табулятора влево, чтобы кнопка свернуть была доступна и доступна для просмотра.

<ul class="nav nav-tabs" style="margin-right:30px">