This is a migrated thread and some comments may be shown as answers.

Tab content styling question

1 Answer 21 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Emil
Top achievements
Rank 2
Emil asked on 21 Feb 2013, 10:18 AM
Hello,

I have a RadWindow. The window contains a table with two rows: the first row (sigle column) contains a RadTabStrip and the second (two colums) contains a checkbox and a button. Each TabStrip contains a RadTreeView:

<table style="width:100%;">
    <tr style="height:100%;vertical-align:top;overflow:auto">
        <td colspan="2">
            <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1" SelectedIndex="0" Width="100%" Height="100%">
                <Tabs>
                    <telerik:RadTab runat="server" Text="Tab1" Selected="True">
                    </telerik:RadTab>
                    <telerik:RadTab runat="server" Text="Tab2">
                    </telerik:RadTab>
                </Tabs>
            </telerik:RadTabStrip>
            <telerik:RadMultiPage ID="RadMultiPage1" runat="server" Width="100%" SelectedIndex="0" Height="100%">
                <telerik:RadPageView ID="RadPageView1" runat="server" Height="100%" style="border: 1px solid grey">
                    <telerik:RadTreeView ID="RadTreeView1" runat="server"></telerik:RadTreeView>
                </telerik:RadPageView>
                <telerik:RadPageView ID="RadPageView2" runat="server" Height="100%" style="border: 1px solid grey">
                    <telerik:RadTreeView ID="RadTreeView2" runat="server"></telerik:RadTreeView>
                </telerik:RadPageView>
            </telerik:RadMultiPage>
        </td>
    </tr>
    <tr>
        <td style="font: normal 12px arial; text-align: left;">
            <asp:CheckBox ID="CheckBox1" runat="server" Text="Do something when checked." AutoPostBack="true" />
        </td>
        <td style="text-align: right">
            <telerik:RadButton ID="CancelButton" runat="server" Text="Cancel" OnClientClicked="windowClose" UseSubmitBehavior="false">
            </telerik:RadButton>
        </td>
    </tr>
</table>

I want the content of the first row to autoresize if the RadWindow is resized and the second row to remain the same.

I've tried setting the row height to 100% but with no result.

1 Answer, 1 is accepted

Sort by
0
Emil
Top achievements
Rank 2
answered on 23 Feb 2013, 09:46 AM
I've solved it by using some javascript to alter the firstrowstyle css height and the RadPageView1 height:

function Resize() {
   $('.firstrowstyle').css({ 'height': (($(window).height()) - 60) + 'px' });
    document.getElementById("<%=RadPageView1.ClientID%>").style.height = $(window).height() - 110 + "px";
}
window.onresize = window.onload = Resize;
Tags
General Discussions
Asked by
Emil
Top achievements
Rank 2
Answers by
Emil
Top achievements
Rank 2
Share this question
or