I've used the Nested Splitter sample in order to create a website with three main panes - the top, left (which has an embedded radmenu) and the right which is where I want all of my content to be. The problem is when the content in the right-pane is lengthly the scrollbar behaves very oddly. It seems to be not scroll to the bottom of the page and disappears into the bottom of the browser (weirdly enough happens in ie and firefox). The nested splitter seems to not have the bottom of the page correctly in my sample - particularly noticable in low resolutions.
I'd like for the contentpane to show a scrollbar when needed (if possible) and for it to actually be valid ;)
Any ideas what's wrong with this code?
Try changing the ContentURL of ContentPane to something lengthy
I'd like for the contentpane to show a scrollbar when needed (if possible) and for it to actually be valid ;)
Any ideas what's wrong with this code?
Try changing the ContentURL of ContentPane to something lengthy
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <asp:Literal id="Literal1" runat="server"></asp:Literal> |
| <head runat="server"> |
| <title></title> |
| <script> |
| if (window!=top){top.location.href=location.href;} |
| </script> |
| <style type="text/css"> |
| .style1 |
| { |
| font-size: x-small; |
| } |
| .style2 |
| { |
| width: 100%; |
| } |
| </style> |
| <style type="text/css"> |
| html, body, form |
| { |
| height: 100%; |
| margin: 0px; |
| padding: 0px; |
| overflow: hidden; |
| } |
| </style> |
| <style type="text/css"> |
| .menuPanes |
| { |
| overflow: visible !important; |
| } |
| </style> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <asp:ScriptManager ID="ScriptManager1" runat="server"> |
| </asp:ScriptManager> |
| <div id="ParentDivElement" style="height: 100%; background-color: #000000;"> |
| <telerik:RadSplitter ID="MainSplitter" runat="server" Height="100%" Width="100%" |
| Orientation="Horizontal" Skin="Black"> |
| <telerik:RadPane ID="TopPane" CssClass="menuPanes" runat="server" Height="5" MinHeight="5" MaxHeight="5" |
| Scrolling="none"> |
| <!-- Place the content of the pane here --> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadsplitbarTop" runat="server" CollapseMode="Forward" /> |
| <telerik:RadPane ID="MainPane" CssClass="menuPanes" runat="server" MinWidth="500"> |
| <telerik:RadSplitter ID="NestedSplitter" runat="server" Skin="Black" LiveResize="true"> |
| <telerik:RadPane ID="LeftPane" CssClass="menuPanes" runat="server" Width="175" MinWidth="150" MaxWidth="400"> |
| <!-- Place the content of the pane here --> |
| <telerik:RadMenu EnableOverlay="false" CollapseAnimation-Type="None" ID="RadMenu2" runat="server" Width="100%" |
| Flow="Vertical" Height="100px" BackColor="White" BorderStyle="None" Skin="Black" ForeColor="Black" |
| style="background-color: #000000"> |
| <Items> |
| <telerik:RadMenuItem Width="100%" id="lblLoginStatus" NavigateUrl="signout.aspx" runat="server"> |
| <GroupSettings ExpandDirection="Right"></GroupSettings> |
| </telerik:RadMenuItem> |
| </Items> |
| <CollapseAnimation Type="None" /> |
| </telerik:RadMenu> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="VerticalSplitBar" runat="server" CollapseMode="Forward" /> |
| <telerik:RadPane ID="ContentPane" CssClass="menuPanes" |
| ContentUrl="home.aspx" runat="server"> |
| <!-- Place the content of the pane here --> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </telerik:RadPane> |
| </telerik:RadSplitter></div> |
| </form> |
| </body> |
| </html> |
1 Answer, 1 is accepted
0
Hello Michael,
I prepared a sample demo based on your code and an external page with a long content loaded in the pane. However, after testing it under IE7, IE8 and Firefox I could not see odd scrollbar behavior - the scrollbar is fully visible and functioning under all the mentioned browsers. What I noticed is that you have a RadSplitter directly nested in a RadPane and in such case you should set the parent pane's Scrolling property to None. I attached my sample demo for your reference - please, examine it and tell me what I am missing to observe the issue or provide reproduction steps if such should be followed to recreate the problem.
Kind regards,
Svetlina
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.
I prepared a sample demo based on your code and an external page with a long content loaded in the pane. However, after testing it under IE7, IE8 and Firefox I could not see odd scrollbar behavior - the scrollbar is fully visible and functioning under all the mentioned browsers. What I noticed is that you have a RadSplitter directly nested in a RadPane and in such case you should set the parent pane's Scrolling property to None. I attached my sample demo for your reference - please, examine it and tell me what I am missing to observe the issue or provide reproduction steps if such should be followed to recreate the problem.
Kind regards,
Svetlina
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.