Я хочу добавить полосу прокрутки, когда тело таблицы html переполняется. Я не хочу прокручивать заголовок таблицы. У меня есть эти коды html и css на моей странице вершины оракула
HTML
<div class="t-Report-wrap">
<div class="t-Report-tableWrap">
<table class="t-Report-report" summary="tab">
<thead>
<tr>
<th class="t-Report-colHead" id="CODE" align="center">Code</th>
<th class="t-Report-colHead" id="HEAD" align="center">Head</th>
</tr>
</thead>
<tbody>
<tr> <td > 5198 </td><td >SUSPENCE </td></tr>
<tr> <td > 1308 </td><td >SHARE IN KNR</td></tr>
<tr> <td > 4803 </td><td >ONE TIME </td></tr>
<tr><td >6021</td><td >NEETHI GOODS </td></tr>
<tr><td >6022</td><td >MANNURE STOCK </td></tr>
<tr><td >4832</td><td >DONATION TO </td></tr>
<tr><td >5218</td><td >CALANDER </td></tr>
<tr><td >4829</td><td >BUILDING TAX </td></tr>
<tr><td >5199</td><td >BICYCLE ADVANCE </td></tr>
<tr><td >2509</td><td >BANK LOAN LT MI(SPL) </td></tr>
</tbody>
</table>
</div>
<div class="t-Report-links"></div>
<table class="t-Report-pagination t-Report-pagination--bottom" role="presentation"></table>
</div>
CSS
.t-Report-wrap {
position: relative;
}
.t-Report-tableWrap {
height:180px;
overflow:auto;
margin-top:20px;
}
.t-Report-tableWrap table {
width:100%;
}
.t-Report-tableWrap table thead th .t-Report-colHead {
position:absolute;
top:-20px;
z-index:2;
height:20px;
width:35%;
border:1px solid red;
}
Но с этим кодом шапка таблицы тоже прокручивается. На это ссылался ответ SO Как отобразить полосу прокрутки на html таблица. Может ли кто-нибудь помочь мне найти ошибку в этом коде?
