scrollbars appears after expand slidingpane

2 posts, 0 answers
  1. Yano
    Yano avatar
    7 posts
    Member since:
    Sep 2009

    Posted 19 May 2010 Link to this post

    scrollbars appears in IE8 after expanding slidingpane, any advice how to fix this problem?  
    sliding pane problem  
    <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %> 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> 
    <html xmlns=""
        <style type="text/css"
            html, body, form 
                height: 100%; 
                width: 100%; 
                margin: 0; 
                padding: 0; 
        <form id="form1" runat="server"
        <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        <telerik:RadSkinManager ID="RadSkinManager1" runat="server" Skin="WebBlue"
        <telerik:RadSplitter runat="server" ID="mainSplitter" Width="100%" Height="100%" 
            Orientation="Horizontal" BorderSize="1"
            <telerik:RadPane runat="server" ID="header" Height="50px"
            <telerik:RadPane runat="server" ID="body" Scrolling="None"
                <telerik:RadSplitter ID="rsSplitter" runat="server" Width="100%" Height="100%" VisibleDuringInit="false"
                    <telerik:RadPane ID="menuPane" runat="server" Width="22px" Height="100%" Scrolling="None" 
                        <telerik:RadSlidingZone ID="SlidingZone" runat="server" Width="22px" Height="100%" 
                            <telerik:RadSlidingPane ID="Menu" Title="Menu" runat="server" Width="220px" MaxWidth="220" 
                                <telerik:RadTreeView ID="TreeView_MainMenu" runat="server" ShowLineImages="false"
                    <telerik:RadPane ID="contentPane" runat="server" Height="100%"
                        <asp:ContentPlaceHolder ID="contentMain" runat="server"


  2. Svetlina Anati
    Svetlina Anati avatar
    2795 posts

    Posted 19 May 2010 Link to this post

    Hello Yano,

    In order to fix the problem, please hide the overflow of the page - if scrollbars are needed, the splitter will generate them:

    <style type="text/css">
           html, body, form
               height: 100%;
               width: 100%;
               margin: 0;
               padding: 0;

    On a side note, I also prepared the following notes which can help you improve the code further:

    - Do not set any sizes to the nested splitters if they are directly nested in a RadPane  - when a RadSplitter is directly nested in a RadPane, it automatically resizes itself to occupy 100% of the parent pane. If you set width, height, fullscreenmode, the splitters will make a lot of calculations to resize themselves and this is not necessary and slows down the performance without any benefit.

    - when you have a vertical RadSplitter, do not set the Height of the child RadPanes (the same for a horizontal splitter and width) due to the above explained performance consideration

    I hope that my reply is helpful, let me know how it goes.

    All the best,
    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.
Back to Top