Nested splitters cause unwanted scroll bars.??

[Michael Okon]

Hi, I am trying to nest a vertical splitter into the bottom pane of a horizonlat splitter.. Just one split bar in each. Here is the code.

<

 

telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal"

 

 

Width="1000px" BorderSize="0" Skin="WebBlue">

 

 

<telerik:RadPane ID="RadPane1" Runat="server" Width="1000px" Height="37px"><asp:Table ID="Table2" runat="server" Width="995px" CellPadding="0" CellSpacing="0" Height="37px">

 

 

<asp:TableRow >

 

 

 

<asp:TableCell Font-Names="Freestyle Script" Font-Size="XX-Large" ForeColor="#3F3F3F" Width="3%"></asp:TableCell>

 

 

<asp:TableCell Font-Names="Freestyle Script" Font-Size="XX-Large" ForeColor="#666666" Width="72%">(Portal)</asp:TableCell>

 

 

<asp:TableCell Font-Names="Arial" Font-Overline="False" Font-Size="Small" ForeColor="#24E6D6" Font-Underline="True" Width="10%">Welcome:</asp:TableCell>

 

 

<asp:TableCell ForeColor="#2A7CC1" Font-Names="Arial" Font-Size="Small" Width="15%"></asp:TableCell>

 

 

 

</asp:TableRow>

 

 

</asp:Table>

 

 

</telerik:RadPane>

 

 

 

<telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode="Forward" />

 

 

 

<telerik:RadPane ID="RadPane2" runat="server" Width="1000px" Height="493px">

 

 

 

 

<telerik:RadSplitter ID="RadSplitter2" runat="server" Height="100%"

 

 

Width="100%">

 

 

<telerik:RadPane ID="RadPane3" runat="server">

 

 

</telerik:RadPane>

 

 

<telerik:RadSplitBar ID="RadSplitBar2" runat="server" />

 

 

<telerik:RadPane ID="RadPane4" runat="server">

 

 

</telerik:RadPane>

 

 

</telerik:RadSplitter>

 

 

 

</telerik:RadPane>

 

 

 

</telerik:RadSplitter>

with this setup I get scrollbars on the right and botom of what I think is the bottom horizontal panel of the first splitter. I would like a clean join onto the side of the splitter border.

I hope this is a quick one, Thanks in advance for your time and help

mike

 

[Tsvetie]

Hello Mike,
You should set Scrolling="None" for the RadPane, holding the nested RadSplitter:

<telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" Width="1000px"
    BorderSize="0" Skin="WebBlue">
    <telerik:RadPane ID="RadPane1" runat="server" Height="37px">
        <asp:Table ID="Table2" runat="server" Width="995px" CellPadding="0" CellSpacing="0"
            Height="37px">
            <asp:TableRow>
                <asp:TableCell Font-Names="Freestyle Script" Font-Size="XX-Large" ForeColor="#3F3F3F"
                    Width="3%"></asp:TableCell>
                <asp:TableCell Font-Names="Freestyle Script" Font-Size="XX-Large" ForeColor="#666666"
                    Width="72%">(Portal)</asp:TableCell>
                <asp:TableCell Font-Names="Arial" Font-Overline="False" Font-Size="Small" ForeColor="#24E6D6"
                    Font-Underline="True" Width="10%">Welcome:</asp:TableCell>
                <asp:TableCell ForeColor="#2A7CC1" Font-Names="Arial" Font-Size="Small" Width="15%"></asp:TableCell>
            </asp:TableRow>
        </asp:Table>
    </telerik:RadPane>
    <telerik:RadSplitBar ID="RadSplitBar1" runat="server" CollapseMode="Forward" />
    <telerik:RadPane ID="RadPane2" runat="server" Height="493px" Scrolling="None">
        <telerik:RadSplitter ID="RadSplitter2" runat="server">
            <telerik:RadPane ID="RadPane3" runat="server">
            </telerik:RadPane>
            <telerik:RadSplitBar ID="RadSplitBar2" runat="server" />
            <telerik:RadPane ID="RadPane4" runat="server">
            </telerik:RadPane>
        </telerik:RadSplitter>
    </telerik:RadPane>
</telerik:RadSplitter>

I have also removed some unnecessary settings from your code in the above code fragment. In case you still have problems, I will need the exact version of the suite that you use as well as the browser in which you reproduce the problem.

Greetings,
Tsvetie
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.