Freezing a row in Asp.NET GridView

In ASP.NET Grid view we don’t have a scroll feature so that the content rows will scroll with mouse not the Header/Footer Rows. Recently in my project I got a requirement where I had to fix the Header and the Top Pager row of a grid view and keep the content of the gridview scrollable once the content height gets more then the container height.

After some hits & trials  and some googling, I got through.

Following is the style you need to use for making a row fix in the Grid.

/*below style is used for freezing grid header so that it doesn’t scrolls with grid rows*/
.GridHeaderFreezing
{ 
   position:relative; 
   top:expression(this.offsetParent.scrollTop);
   padding:0px;
   margin:0px;    
   z-index: 10;
}

and apply this CSS Class to the row you want to make static. for example:

<HeaderStyle CssClass=”GridHeaderFreezing“></HeaderStyle>

like wise you can apply this style to any of the Rows of a GridView.

PS: It works great with Internet Explorer but not on FF

Hope it helps 🙂