Grid 100% Issue

[Paul]

Hello,

I am having trouble getting my RadGrid to go to 100% height.

The RadGrid is set to 100% and to allowscrolling with a scroll height of 100%.

The RadGrid is inside a Pageview > MultiPage > AjaxPanel > Form > Body > HTML - all of which are 100%.

Am I missing something stupid here? Please help!

Regards, Paul.

[Venelin]

Hello Paul,

Assuming your page has the following structure:

ASPX:

<telerik:RadMultiPage ID="RadMultiPage2" runat="server" SelectedIndex="0" Width="400" CssClass="MyRadMultiPage">
    <telerik:RadPageView ID="RadPageView1" runat="server">
        <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
            <telerik:RadGrid runat="server" ID="RadGrid1" OnNeedDataSource="RadGrid_NeedDataSource" Skin="Default" Height="100%">
                <MasterTableView TableLayout="Fixed" AutoGenerateColumns="false">
                    <Columns>

                    </Columns>
                </MasterTableView>
                <ClientSettings>
                    <Scrolling AllowScroll="true" UseStaticHeaders="true" />
                </ClientSettings>
            </telerik:RadGrid>
        </telerik:RadAjaxPanel>
    </telerik:RadPageView>
</telerik:RadMultiPage>

the thing you need to do is to set an explicit height to every ascendent element of RadGrid. So this will result in the following CSS in this concrete example:

html,
body,
form,
.MyRadMultiPage,
.MyRadMultiPage > div,
.MyRadMultiPage .RadAjaxPanel,
.MyRadMultiPage .RadAjaxPanel > div {
    height: 100%;
}

It should be adapted if there is any difference (say in custom css classes) in your case. This requirement comes from web standards where it is stated that in order to set height in percent for an element it is needed that ascendent elements have explicit widths (either in percent or pixels).

Regards,
Venelin
Telerik