Исправить первые 3 динамических столбца

Question

У меня есть стол с заголовками строк. Я хочу исправить первые 3 столбца при горизонтальной прокрутке. У меня почти 25 столбцов в этой таблице.

 <table cellspacing="0" class="data border" id="question_grid" style="width:110%"> 
      <thead> 
       <tr class="headings"> 
        <th>Heading 1</th> 
        <th>Heading 2</th> 
        <th>Heading 3</th> 
        <th>Heading 4</th> 
        <th>Heading 5</th> 
       </tr> 
       <tr class="filter"> 
        <th>Filter 1</th> 
        <th>Filter 2</th> 
        <th>Filter 3</th> 
        <th>Filter 4</th> 
        <th>Filter 5</th> 
       </tr> 
      </thead> 
      <tbody id="trgrid"> 
       <tr id="grid_menu_2"> 
        <td>Data 1</td> 
        <td>Data 2</td> 
        <td>Data 3</td> 
        <td>Data 4</td> 
        <td>Data 5</td>     
       </tr> 
      </tbody> 
    </table> 

Я пробовал использовать CSS, но я мало знаю о проектировании. Я добавил position:fixed первому ребенку строк заголовка, фильтра и данных. Строки данных будут краткими. Я использую для цикла, чтобы добавить эти строки.

.headings th:first-child 
{ 
    position: fixed; 
    left: 5px; 
    right:20px; 
} 

.filter th:first-child 
{ 
    position: fixed; 
    left: 5px; 
    right:20px;  
} 

.main_data_first 
{ 
    position: fixed; 
    left: 5px; 
    right:20px;  
} 

Answer 1

Найдено результатов по http://datatables.net/ Он использует jQuery.