Html table fixed header with scrolling body only in ASP.NET, MVC using Jquery, CSS

Here I will explain about how to write a code for html table with fixed header. Here I will take header columns in one table and content placed in another table in a division. I give a class name (.div-table-content) to the body data division.

.div-table-content { //div class name
            height: 350px;
            overflow: auto;
            margin-right: -14px;
        }

<div class="tblSearchUserData">
                    <table class="table table-condensed">
                        <thead>
                            <tr>
                                <th style="width: 40%">ID</th>
                                <th>First Name</th>
                                <th>Last Name</th>
                                <th>Company</th>                              
                            </tr>
                        </thead>
                    </table>
                    <div class="div-table-content">
                        <table class="table tablesorter table-condensed" id="tblSearchUserData">
                            <tbody>
                        </table>
                    </div>                  
                </div>