fixing the header row in gridview??

Question

I used a grid view in my project. in that i used vertical scrolls.. its work fine.

But the problem is , when i scroll down the header is also move

I want to have a fixed header provided the contents alone scroll.

please give me an advice in this regard.

I found many examples but most of them did not work for Chrome.. is there something which is universal and i can use for free....

any suggestions will be appreciated...

Thanks

<div>
<asp:Panel ID="Panel1" runat="server" Height="100px" ScrollBars="Vertical">

 <asp:GridView ID="GridView1" runat="server" AllowSorting="True" 
        AutoGenerateColumns="False" BackColor="White" BorderColor="#CCCCCC" 
        BorderStyle="None" BorderWidth="1px" CellPadding="3"  
        DataKeyNames="MachineGroupID" DataSourceID="SqlDataSource1">
        <RowStyle ForeColor="#000066" />
        <Columns>

        </Columns>
        <FooterStyle BackColor="White" ForeColor="#000066" />
        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
        <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
    </asp:GridView>
    </asp:Panel>

Answer 1

Could you give some more information? E.g some source code?

Answer 2

Take a look at How to create an HTML table with frozen headers and columns . This is just one of many articles out there about this issue. You may need to try this or one of the other solutions people have come up with to decide which works best for you. Frozen table header inside scrollable div is another SO post on this issue.