부트 스트랩 : 테이블 응축 된 진행 막대

Question

부트 스트랩 3 진행률 표시 줄을 테이블 응축 된 부트 스트랩 테이블에 추가하면 행의 "응축 된"부분이 손실됩니다 (키가 커짐). 진행률 막대의 기본 최소 높이가 테이블 집계 된 행을 더 크게 할 수 있습니까?

JSFiddle :

여기에 내가 "해결"하기 위해 노력하고있어 동작의 예 Condensed table/progress bar example

<table class='table table-condensed table-striped'> 
    <tr> 
     <td>one</td> 
     <td>two</td> 
     <td>three</td> 
    </tr> 
    <tr> 
     <td>one</td> 
     <td>two</td> 
     <td>three</td> 
    </tr> 
    <tr> 
     <td>one</td> 
     <td>two</td> 
     <td>three</td> 
    </tr> 
</table> 

<br/> 

<table class='table table-condensed table-striped'> 
    <tr> 
     <td>one</td> 
     <td>two</td> 
     <td>three</td> 
    </tr> 
    <tr> 
     <td>one</td> 
     <td> 
      <div class='progress progress-striped'> 
       <div class="progress-bar progress-bar-warning" role="progressbar" style="width: 50%;"> 
        Progress 
       </div> 
      </div> 
     </td> 
     <td>three</td> 
    </tr> 
    <tr> 
     <td>one</td> 
     <td>two</td> 
     <td>three</td> 
    </tr> 
</table> 

Answer 1

부트 스트랩이 진행 바 div의에 margin-bottom: 20px;을 추가합니다. 해당 크기의 테이블 행을 적절하게 무시합니다.

Answer 2

진행률 클래스의 여백 CSS 속성을 재정의해야합니다.

.progress { 
    margin-bottom: 0 !important; 
} 

페이지 머리에 추가 스타일로 추가하거나 CSS를 추가 수업으로 추가하십시오.