Grid content size doesn't account for vertical scroll bars on IE7

[Random]

We have a web application that uses grids and needs to target IE7 up to IE10.

On IE7, if the grid has enough data to show a vertical scrollbar, the grid header resizes itself to account for the width of the scrollbar on the right hand side but the content area doesn't. This means that the scrollbar is over top of the content in the right hand column of the grid, and the grid headers no longer line up with the columns in the grid. 

We are using a custom skin for these grids.

Is there a fix or recommended work around for this?

Thanks
Enjoy
Random

[Venelin]

Hi Random,

In general, when some actions like insert or delete data items on client are performed  you need to call the .repaint() method to the grid OnRowCreated and/or OnRowDeleted client-side events. Another possible solution is to add the following CSS rule to your page styles:

CSS:

Copy Code

.MyGrid .rgDataDiv {
    overflow-y: scroll !important;
}

ASPX:

Copy Code

<telerik:RadGrid ID="RadGrid1" runat="server"  CssClass="MyGrid"...>
   ....
</telerik:RadGrid>

The inconvenience here is that if the records are too few, RadGrid will still display the vertical scroll, but it won't be scrollable. This will prevent the headers-columns misalignment.

I hope this helps

Regards,
Venelin
Telerik