Fix table head in IE 11

I've a function that allows me to keep the THs of my table fixed despite scrolling. In Google chrome doesn't present this problem since it works very well

But I am interested in making it work in IE11 But it looks like this:

Is there anything I can do to solve this problem?

I'm working with:

• MVC 4
• jQuery 1.7

Table code:

    <div class="tableFixHead">
<table style="margin-left:auto; margin-right:auto;">  
    <thead>
    <tr>   
        <th>STATUS</th>  
        <th>EMP #</th>  
        <th>TYPE</th>  
        <th>NAME</th>  
        <th>LEADERS</th>  
        <th>DEPARTMENT</th>  
        <th>TEAM / PART</th>
        <th>SERIAL</th>
        <th>FA</th>
        <th>SECURITY</th>
        <th>BRAND</th>
        <th>MODEL</th>  
        <th>YEAR</th>
        <th>MONTH</th>
        <th>PRICE</th>
        <th>DATA DESTRUCTION</th>
        <th>LOCATION</th>   
    </tr>   
  </thead>
@foreach (var item in Model) {  
    <tbody>
        <tr>  
            <td>@Html.DisplayFor(modelItem => item.HW_STATUS)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_ASSIGN)</td>  
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_TYPE)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_ASIGN_NAME)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_LEADERTYPE)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_DEPT)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_DEPTEAM)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_SERIAL)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_FA_TAG)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_SECURITY_TAG)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_BRAND)</td>     
            <td>@Html.DisplayFor(modelItem => item.HW_MODEL)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_YEAR)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_MONTH)</td>
            <td>$@Html.DisplayFor(modelItem => item.HW_PRICE)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_EMP_DATA_DESTRUCTION)</td>
            <td>@Html.DisplayFor(modelItem => item.HW_LOCATION)</td>  
            <td>@Html.ActionLink("Edit", "LaptopInventoryEdit", new { id = item.ID})</td>         
        </tr>  
    </tbody>
}    
</table>
</div>

jQuery code:

    $(document).ready(function () {
var $th = $('.tableFixHead').find('thead th')
$('.tableFixHead').on('scroll', function () {
    $th.css('transform', 'translateY(' + this.scrollTop + 'px)');
    });
    });