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

Nested Tab Strip and ScrollChildren = True

1 Answer 92 Views

TabStrip

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

Paul Mc asked on 18 May 2009, 10:08 AM

I have a nested splitter pane and a tab strip located in the lower tab. With ScrollChildren = true, I'm getting what looks like 17px of margin at the bottom of my screen whenever a tab is added to the tab strip in Firefox. Other browsers seem to work fine. If i remove all the tabs, leaving the tab strip, then the white space disappears.

I've attached a cut down version of my code below.

    
            <telerik:RadSplitter ID="RadSplitter1" runat="server" BorderSize="0" Height="100%" Width="100%" >                 
        
                <telerik:RadPane ID="RadPane1" runat="server" Height="100%" > 
        
                    <telerik:RadSplitter ID="RadSplitter2" runat="server" Orientation="Horizontal" Width="100%" Height="100px" BorderSize="0" > 
        
                        <telerik:RadPane ID="RadPane2" runat="server">  
        
                        </telerik:RadPane> 
        
                        <telerik:RadPane ID="RadPane3" runat="server" Height="26px">  
        
                            <telerik:RadTabStrip ID="RadTabStrip1" runat="server" ScrollChildren="true">  
        
                                <Tabs> 
        
                                    <telerik:RadTab Text="Tab 1"></telerik:RadTab> 
        
                                </Tabs> 
        
                            </telerik:RadTabStrip> 
        
                        </telerik:RadPane> 
        
                    </telerik:RadSplitter> 
        
                </telerik:RadPane> 
        
            </telerik:RadSplitter>

I have seen other threads with similar problems, but the solutions for those dont appear to be applicable to this issue.

Thanks in advance.

1 Answer, 1 is accepted

Accepted

answered on 18 May 2009, 10:54 AM

Hi Paul,

Please find below a sample code snippet that shows the needed approach.

    
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title></title>  
        
                <style type="text/css">  
        
                    html, body, form  
        
                    {  
        
                        margin: 0;  
        
                        height: 100%;  
        
                        width: 100%;  
        
                        overflow: hidden;  
        
                    }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form runat="server" id="mainForm" method="post">  
        
                <telerik:RadScriptManager ID="ScriptManager" runat="server" /> 
        
                <telerik:RadSplitter ID="RadSplitter1" runat="server" BorderSize="0" Height="100%" 
        
                    Width="100%">  
        
                    <telerik:RadPane ID="RadPane1" runat="server" Height="100%">  
        
                        <telerik:RadSplitter ID="RadSplitter2" runat="server" Orientation="Horizontal" Width="100%" 
        
                            Height="100px" BorderSize="0">  
        
                            <telerik:RadPane ID="RadPane2" runat="server">  
        
                            </telerik:RadPane> 
        
                            <telerik:RadPane ID="RadPane3" runat="server" Height="26px">  
        
                                <telerik:RadTabStrip ID="RadTabStrip1" runat="server" ScrollChildren="True">  
        
                                    <Tabs> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab1">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab2">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab3">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab4">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab5">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab6">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab7">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab8">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab9">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab10">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab11">  
        
                                        </telerik:RadTab> 
        
                                        <telerik:RadTab runat="server" Text="Root RadTab12">  
        
                                        </telerik:RadTab> 
        
                                    </Tabs> 
        
                                </telerik:RadTabStrip> 
        
                            </telerik:RadPane> 
        
                        </telerik:RadSplitter> 
        
                    </telerik:RadPane> 
        
                </telerik:RadSplitter> 
        
                </form> 
        
            </body> 
        
            </html>

ncerely yours,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.