Gap below horizontal scrollbar on initial page load

[Kellie]

I have a strange problem occurring on my grid.

My grid has a detailtable and expand/collapse button. It uses a setting FrozenColumnsCount="3" .
On initial load of the page, the grid shows a gap below the Horizontal scrollbar. Also, the frozen columns do not work on this initial load.
Please see attached screen shots.

I found if I removed  FrozenColumnsCount="3" from the grid, the problem does not occur. This might be a coincidence though??
I also found, if I click the expand button, the problem disappears.

This might be too hard to troubleshoot what is causing this, but I need some guidance as to a 'workaround'. As I said above, the problem disappears when clicking expand. Do you know what part of the expand code is fixing this?

Some background information. My grid is underneath a table. I have some javascript that calculates the grid's splitter height based on a parent container minus the table height. This appears to work successfully, but I thought I would share this in case it could be influencing the problem.

<telerik:RadSplitter ID="RadSplitterRoadRoadwayGrid" runat="server" Width="100%" Orientation="Vertical"

                BorderSize="0" VisibleDuringInit="false" OnClientLoad="setSplitterHeight">

                <telerik:RadPane ID="RadPaneRoadRoadwayGrid" runat="server" Scrolling="None" BorderWidth="0"

                    Width="100%">

// Calculates the height of the grid on the fly.
function setSplitterHeight(splitter, arg) {
    var myAjaxPanel = document.getElementById('<%= RadAjaxPanelRoadRoadway.ClientID %>');
    var panelHeight = myAjaxPanel.parentNode.parentNode.clientHeight;
    var myTable = document.getElementById('myTable');
    var tableHeight = myTable.clientHeight;
    splitter.set_height(panelHeight - tableHeight - 36);
    var pane = splitter.GetPaneByIndex(0);
    pane.set_height(panelHeight - tableHeight - 36);
}

I am also applying column widths at runtime. The way I am doing this is shown in the following post:
http://www.telerik.com/community/forums/aspnet-ajax/grid/how-to-set-column-width-in-code-behind-for-detailtable.aspx

Thank you for any insight into this problem!
Kellie

[Kellie]

I have actually created a simplified project showing the problem. I will create a ticket for it.
If I receive a solution, I will post the answer here so that those having the same problem will know how to fix it.

[Dimo]

Hi Kellie,

Currently there is a limitation in the RadGrid control, which prevents it from properly initializing its layout and functionality when scrolling with static headers (and frozen columns as well) are enabled. This has been fixed and changes will take effect in the next RadControls internal build and official release (Q3 2010 SP1, due somewhere in mid December).

Currently you can avoid the problem by setting RenderSelectedPageOnly="true" to the RadMultiPage control and using AJAX to switch between tabs/pageviews.

By the way, RadGrid column widths should be set with HeaderStyle-Width only, not ItemStyle-Width.

Sincerely yours,
Dimo
the Telerik team