부트 스트랩 테이블 고정 헤더 콜 스팬이 작동하지 않습니다.

Question

고정 헤더가있는 부트 스트랩 테이블이 있습니다. 잘 작동합니다.

테이블에 colspan을 추가 할 때. 표가 축소됩니다.

는 다른 가능성을 사전에 모두 fixed header 및 테이블 colspan

감사가 달성하는 것입니다

DEMO :FIDDLE

CSS

.table-fixed thead { 
    width: 97%; 
} 
.table-fixed tbody { 
    height: 230px; 
    overflow-y: auto; 
    width: 100%; 
} 
.table-fixed thead, .table-fixed tbody, .table-fixed tr, .table-fixed td,    .table-fixed th { 
    display: block; 
} 
.table-fixed tbody td, .table-fixed thead > tr> th { 
    float: left; 
    border-bottom-width: 0; 
} 

출력 : 위해

Answer 1

전체 폭을 유지하는 세포에 열 병합 사용하는, 당신은 부트 스트랩의 12 열 레이아웃을 유지하기 위해 TD 클래스를 변경해야합니다.

예를 들어, 당신은이를 대체 할 수있는이와

<tr> 
    <td class="col-xs-2">1</td> 
    <td class="col-xs-8">Mike Adams</td> 
    <td class="col-xs-2">23</td> 
</tr> 

을 :

<tr> 
    <td class="col-xs-2">1</td> 
    <td colspan="2" class="col-xs-10">Mike Adams</td> 
    <!--<td class="col-xs-2">23</td>--> 
</tr> 

는 그래서, <td class="col-xs-8">마르크 업이 12 열 레이아웃을 유지하기 위해, <td colspan="2" class="col-xs-10">된다

.

JSFiddle