Doubt Headerfixed Gridview

Question

I am using this code to leave the top of Gridview fixed, however it is not Responsive, and a little short to fully fill the grid.

    <script language="javascript">
        $(document).ready(function () {
            var gridHeader = $('#<%=GridView1.ClientID%>').clone(true);
            $(gridHeader).find("tr:gt(0)").remove();
            $('#<%=GridView1.ClientID%> tr th').each(function (i) {

                $("th:nth-child(" + (i + 1) + ")", gridHeader).css('width', ($(this).width()).toString() + "px");
            });
            $("#controlHead").append(gridHeader);
            $('#controlHead').css('position', 'absolute');
            $('#controlHead').css('top', $('#<%=GridView1.ClientID%>').offset().top);

        });
    </script>

I would like it to be Responsive, just like the Gridview is, and also stay the correct size of the Gridview.