If I put a RadSplitter inside a DIV that has margins set on it, the RadSplitter behaves as expected. However, if the RadSplitter is nested inside another RadSplitter (and still inside a DIV with margins set on it) then the width gets messed up.
Here is an example:
Naturally the actual layout is much more complex, but I've narrowed my problem down to this sample code. I would expect this page to render without any scrollbars at all. Is there a way to accomplish this?
Scott
Here is an example:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Sample.aspx.cs" Inherits="Sample" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <telerik:RadSplitter ID="MainSplitter" runat="server" Orientation="Horizontal" Height="100%" Width="100%"> <telerik:RadPane ID="ContentPane" runat="server"> <div style="margin: 0 30px 0 30px;"> <telerik:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" Height="100%" Width="100%"> <telerik:RadPane ID="TopPane" runat="server" Height="50%"> Top Pane </telerik:RadPane> <telerik:RadSplitBar ID="SplitBar" runat="server" /> <telerik:RadPane ID="BottomPane" runat="server" Height="50%"> Bottom Pane </telerik:RadPane> </telerik:RadSplitter> </div> </telerik:RadPane> </telerik:RadSplitter> </form> </body> </html>Naturally the actual layout is much more complex, but I've narrowed my problem down to this sample code. I would expect this page to render without any scrollbars at all. Is there a way to accomplish this?
Scott
1 Answer, 1 is accepted
0
Hi Scott,
By design, if RadSplitter is nested inside another splitter it inherits the size of its parent pane. To stop this behavior you need to set ResizeWithParentPane property of the nested splitter to false, e.g:
Also, when setting RadSplitter to use percentage values to its Height property you need to make sure that all its parent have set Height (as percent or strict value).
I hope this helps.
Regards,
Dobromir
the Telerik team
By design, if RadSplitter is nested inside another splitter it inherits the size of its parent pane. To stop this behavior you need to set ResizeWithParentPane property of the nested splitter to false, e.g:
<telerik:RadSplitter ID="MainSplitter" runat="server" Orientation="Horizontal" Height="100%" Width="100%"> <telerik:RadPane ID="ContentPane" runat="server"> <div style="margin: 0 30px 0 30px; height:100%;"> <telerik:RadSplitter ID="RadSplitter1" runat="server" ResizeWithParentPane="false" Orientation="Horizontal" Height="100%" Width="100%"> <telerik:RadPane ID="TopPane" runat="server" Height="50%"> Top Pane </telerik:RadPane> <telerik:RadSplitBar ID="SplitBar" runat="server" /> <telerik:RadPane ID="BottomPane" runat="server" Height="50%"> Bottom Pane </telerik:RadPane> </telerik:RadSplitter> </div> </telerik:RadPane></telerik:RadSplitter>Also, when setting RadSplitter to use percentage values to its Height property you need to make sure that all its parent have set Height (as percent or strict value).
I hope this helps.
Regards,
Dobromir
the Telerik team
Do you want to have your say when we set our development plans?
Do you want to know when a feature you care about is added or when a bug fixed?
Explore the
Telerik Public Issue Tracking
system and vote to affect the priority of the items