RadSplitter height 100%

32 posts, 0 answers
  1. Tad
    Tad avatar
    9 posts
    Member since:
    Jun 2008

    Posted 24 Sep 2008 Link to this post

    k, I am having a terrible time with making the splitter take up 100% of the height (full page).

    I can make it work easily without using master pages.  I simply follow the example that you guys have provided and it works wonderfully.  However, if I take the exact same example and apply it to my web app that is using a master page, I cannot get it to work at all.  Has anyone been able to have the splitter take up the full page using a master pages?  If so, can I see an example of how it was done?

    Thanks,
    Tad
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 25 Sep 2008 Link to this post

    Hello Tad,

    In order to make RadSplitter occupy 100% of the available space you should include the following style in the MasterPage's head:

    <style type=css>  
    html, body, form  
    {  
       height: 100%;  
       margin0px;  
       padding0px;  
    }  
    </style> 

    You should also set the splitter's Width and Height properties to 100%.

    Please, also note that if your RadSplitter is placed in another elements, e.g DIV, etc., you should also explicitly set their sizes.

    Regards,
    Svetlina
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tad
    Tad avatar
    9 posts
    Member since:
    Jun 2008

    Posted 25 Sep 2008 Link to this post

    I must be missing something really simple here, but I followed your directions and it still does not behave correctly.

    Here is my master page:

    <%

    @ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

    <!

    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">

    <

    head runat="server">

    <title>Using Master Page</title>

    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />

    <style type="text/css">

    html, body, form

    {

    height: 100%;

    margin: 0px;

    padding: 0px;

    }

    </style>

    </

    head>

    <

    body>

    <form id="form1" runat="server">

    <div class="MasterBlueHeader">

    <div class="MasterHeaderText">

    <asp:Label ID="lblTitle" runat="server" Text="Database Restore Project"></asp:Label>

    <br />

    <asp:ScriptManager ID="ScriptManager1" runat="server">

    </asp:ScriptManager>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <ContentTemplate>

    <asp:Label ID="lblSystemStatus" runat="server" Text="System Status: "></asp:Label>&nbsp;&nbsp;<asp:Label ID="lblSysStatus" runat="server"></asp:Label>

    </ContentTemplate>

    </asp:UpdatePanel>

    <br />

    <div style="text-align:right; font-size:8pt">

    <asp:Label ID="lblLoggedInAs" runat="server"></asp:Label>

    </div>

    <div style="text-align:right; font-size:8pt">

    <asp:LinkButton ID="lnkButton" Text="Log Out" runat="server"></asp:LinkButton>

    </div>

    </div>

    </div>

    <br /><br />

    <asp:contentplaceholder id="mainContent" runat="server">

    </asp:contentplaceholder>

    <br /><br />

    <div class="MasterBlueFooter">

    </div>

    </form>

    </

    body>

    </

    html>



    Here is my page that holds the radsplitter:

    <%

    @ Page Language="C#" AutoEventWireup="true" MasterPageFile="~/MasterPage.master" CodeBehind="HoldingPageWithMaster.aspx.cs" Inherits="Reports.HoldingPage" %>

    <%

    @ Register Assembly="RadAjax.Net2" Namespace="Telerik.WebControls" TagPrefix="radA" %>

    <%

    @ Register Assembly="RadSplitter.Net2" Namespace="Telerik.WebControls" TagPrefix="radspl" %>

    <

    asp:Content ID="Content1" runat="server" ContentPlaceHolderID="mainContent">

    <radspl:RadSplitter ID="RadSplitter1" runat="server" Orientation="Horizontal" Height="100%" Width="100%">

    <radspl:RadPane id="contentPane" Scrolling="Both" ContentUrl="Reports/UserReport.aspx" runat="server"></radspl:RadPane>

    </radspl:RadSplitter>

     

    </asp:Content>



    Now if I take this same content and put it outside of a master page; it works fine and as I would expect.  But, as soon as I throw the radsplitter into a page that's using a master page, it does not take up the 100% height on the page.

  5. Tad
    Tad avatar
    9 posts
    Member since:
    Jun 2008

    Posted 29 Sep 2008 Link to this post

    Any thoughts from the Telerik team?
  6. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 29 Sep 2008 Link to this post

    Hi Tad,

    I tested the provided code both under IE7 and FF3 but I was not able to reproduce the problem - the splitter occupies 100% of the available space.

    Would you please prepare a sample, fully runnable reproduction demo project which contains only your splitter , open a new support ticket and send it to me along with information about the browser under which the problem occurs? Once I receive it, I will do my best to help.

    Kind regards,
    Svetlina
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. Hong
    Hong avatar
    15 posts
    Member since:
    Apr 2009

    Posted 26 Apr 2009 Link to this post

    I have a horizontal RadSplitter in my project, it worked good without Height="100%". However, when I set RadSplitter's Height to 100%, then the splitbar did not work correctly (it could not expand after it was collapsed.)  Here are my sample code, please let me know what is wrong.
     

    <%

    @ Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>

     

     

    <%

     

     

    @ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

     

     

     

     

     

     

    <!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">

     

     

     <

     

     

     

     

    head runat="server">

     

     

     <

     

     

     

    title>Testled Page</title>

     

     

     

     

     

     

    <style type="css">

     

     

     

     

     

     

    html, body, form

     

     

     {

     

     

     

     

    height: 100%;

     

     

    m

     

     

     

    argin: 0px;

     

     

     

     

     

     

    padding: 0px;

     

     

    }

     

     

     

     

    </style>

     

     

     

    </head>

     

     

     <

     

     

     

     

    body>

     

     

     

     

     

     

    <form id="form1" runat="server">

     

     

     

     

     

     

    <asp:ScriptManager ID="ScriptManager1" runat="server">

     

     

     

     

     

     

    </asp:ScriptManager>

     

     

     

     

     

     

    <telerik:RadSplitter ID = "s1" runat = "server" Orientation = "Horizontal" Height = "100%">

     

     

     

     

     

     

    <telerik:RadPane ID = "p1" runat = "server" Height = "100%">

     

     

     

     

     

     

    NAME:

     

     

     

     

    <asp:Label ID="NAMELabel" runat="server" Text="TESTER"></asp:Label><br />

     

     

     

     

     

    </telerik:RadPane>

     

     

     

     

     

     

    <telerik:RadSplitBar ID = "b1" runat = "server" CollapseMode = "Both" />

     

     

     

     

     

     

    <telerik:RadPane ID = "P2" runat = "server" Height = "100%">

     

     

     

     

     

     

    DESCRIPTION:

     

     

     

     

    <asp:TextBox ID="DESCRIPTIONTextBox" runat="server" Text="Test Splitter."></asp:TextBox><br />

     

     

     

     

     

    </telerik:RadPane>

     

     

     

     

     

     

    </telerik:RadSplitter>

     

     

     

     

     

     

    </form>

     

     

     </

     

     

     

     

    body>

     

     

     </

     

     

     

     

    html>

     

     

     

     

     

     

     

  8. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 27 Apr 2009 Link to this post

    Hello Hong,

    I built up a test page based on the provided code and I was able to reproduce the problem. In order to get the desired behavior, please go through the following steps:

    1. Set

       

      <style type="text/css">  instead of

       

       

      <style type="css">  in order to make the browsers interpret the style correctly.

       

       

       

    2. You cannot set the height of each RadPane to be 100% of the splitter since it is horizontal - if one of the panes becomes 100%, there will be no space for the other one. You can set height either for both of them explicitly (but the sum should be exactly the same as the whole splitter height), or set height only for one of them - in this manner the other pane will automatically calculate its correct size. You can also leave both the panes without size - they will become exactly 50% of the splitter each.

    I hope that my explanations are helpful and after I applied the above explained settings to the test page everything started working as expected. for your convenience I attached it to the thread.

    All the best,
    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.
  9. Hong
    Hong avatar
    15 posts
    Member since:
    Apr 2009

    Posted 27 Apr 2009 Link to this post

    Thank you so much, now I can let horizontal RadSplitter work in the regular web page. However, when I try to use the same horizontal RadSplitter in a user control(.ascx file) which is loaded in a DotNetNuke page, the RadSplitter did not work there.  Is there anything I can do to let it work in DotNetNuke page?
  10. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 29 Apr 2009 Link to this post

    Hello Hong,

    The only reason for the problem I can assume is that there are some parent elements of the splitter which do not have their height explicitly set. Please, make sure that all the parent elements of the splitter, e.g DIV, TD, etc have the height set. In case the problem persists, it will be helpful if you can provide a live url where we can observe the issue. 

    Best wishes,
    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.
  11. Hong
    Hong avatar
    15 posts
    Member since:
    Apr 2009

    Posted 29 Apr 2009 Link to this post

    Thanks for your help. However, the RadSplitter still can not work correctly after I set height to 100% for all parent items. I appreciate if you could have a look at the DNN module. Please go to: 
    http://dev.barbourconsulting.com/dnn/Default.aspx
    username: userHR 
    password: userHR123
    After login, click Human Resources tab, then select any employee by clicking "Edit" link button, you will see how my RadSplitter works. Any suggestion is greatly appreciated.

          
  12. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 04 May 2009 Link to this post

    Hello Hong,

    I examined the provided url but I got a server error - please see the attached screenshot. Let me know when you fix the problem or best - open a new support ticket and send me a sample reproduction demo along with detailed explanations of the problem and reproduction steps and I will do my best to help.

    Sincerely yours,
    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.
  13. Carlos Amigo
    Carlos Amigo avatar
    7 posts
    Member since:
    Aug 2009

    Posted 02 Sep 2009 Link to this post

    I've RadControls for ASP.NET AJAX Q2 2009. I'm building a user control. This is my code:

     

    <%

    @ Control Language="C#" AutoEventWireup="true" CodeFile="Chart.ascx.cs" Inherits="Controls_Chart" %>

     

     

     <%

    @ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

     

     

     

    <

     

    asp:Panel ID="Panel1" runat="server" Height="300px">

     

     

     

           <telerik:RadSplitter ID="RadSplitter1" Width="600px" Height="300px" runat="server" Orientation="Vertical" >

     

            

            <telerik:RadPane ID="RadPane1" runat="server" Width="300">Toolbar</telerik:RadPane>

     

     

     

                   <telerik:RadSplitBar ID="RadSplitBar1" runat="server" EnableAjaxSkinRendering="true" CollapseMode="Forward" CollapseExpandPaneText="Business" />

     

     

     

                    <telerik:RadPane ID="RadPane2" runat="server">Chart</telerik:RadPane>

     

     

            </telerik:RadSplitter>

     

    </

     

    asp:Panel>

    When I run this, the splitter exceed the height of panel. If I change the panel with <div style="height:300px;">, this take 300px of height but the splitter overwrite and exceed the div, (splitter always has about 600 or 700px). 

    What's wrong?
    TIA
    Charly

     

     

     

     

     

  14. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 07 Sep 2009 Link to this post

    Hello Carlos,

    The only thing I can think of which might be affecting your splitter to get bigger than specified is that you have put your user control in another RadPane on the resultant page. If so, the splitter will automatically occupy 100% of the parent pane instead of taking the size you have set. In order to get the desired result you should set ResizeWithParentPane="false" for the splitter which is in the user control. You can find more information about the property is available below:

    http://demos.telerik.com/aspnet-ajax/splitter/examples/nestedsplitters/defaultcs.aspx


    Sincerely yours,
    Svetlina
    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.
  15. Carlos Amigo
    Carlos Amigo avatar
    7 posts
    Member since:
    Aug 2009

    Posted 07 Sep 2009 Link to this post

    Great! That was the problem. Now I can resize the splitter.

    Thank you.

    Charly
  16. Chris Moore
    Chris Moore avatar
    14 posts
    Member since:
    Jul 2009

    Posted 13 Aug 2010 Link to this post

    You know, this thing with the height of the RadSplitter is ridiculous. I was beating my head agains the wall trying to figure out why the splitter was only taking up a small amount of height on my page. The only way I've been able to increase the height beyond the default is to use absolute units. Finally, thought I, I'll search google. When you type in "radsplitter" the FIRST suggestion is "radsplitter HEIGHT". Apparrently, many people are having trouble with this - and this issue, judging from the time the post was first made - is a long-standing one. I've followed all of the suggestions here and yet, STILL, the splitter is not occupying all of the space. I've verified, in fact that the splitter is the culprit. If I take the splitter out and fill in with text, the entire page is used. As soon as I put the splitter in I'm defaulted to 500 pixels or so in height. C'mon guys, you make some great controls. Fix this silly issue. Right now, I have no idea how to make the thing take up all the height. By DEFAULT it should take up all the height, not some X arbirtrary number of pixels !!!  EG,


     

    <%

     

    -- ALWAYS Fixed height, around 500 pixels

     

    If I get rid of the splitter and fill in the content with text, the entire page is used

    --

     

     

    %> <telerik:RadSplitter ID="radSplitter" runat="server" Width="100%" Height="100%">

     

     

     

     

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

     

     

     

    <asp:ContentPlaceHolder runat="server" ID="LeftColumn">

     

     

     

    </asp:ContentPlaceHolder>

     

     

     

    </telerik:RadPane>

     

     

     

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

     

     

     

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

     

     

     

    <asp:ContentPlaceHolder runat="server" ID="MiddleColumn">

     

     

     

    </asp:ContentPlaceHolder>

     

     

     

    </telerik:RadPane>

     

     

     

     

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

     

     

     

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

     

     

     

    <asp:ContentPlaceHolder runat="server" ID="RightColumn">

     

     

     

    </asp:ContentPlaceHolder>

     

     

     

    </telerik:RadPane>

     

     

     

     

    </telerik:RadSplitter>

     

  17. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 18 Aug 2010 Link to this post

    Hi Chris Moore,
    The problem that you describe is not related to RadSplitter. Basically, in case you set the height of an HTML element in percentages, you must make sure that all its parent elements have a height style applied. Otherwise, you break the following rule:

    If a web page element has its height defined in percent, its parent element must have a height style as well. The rule applies recursively.

    You can read about this rule on the W3 site (http://www.w3.org/TR/CSS21/visudet.html#the-height-property):

    quote:
    "<percentage>
    Specifies a percentage height. The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the value computes to 'auto'. A percentage height on the root element is relative to the initial containing block. "

    You can refer to this online article (http://demos.telerik.com/aspnet-ajax/Splitter/Examples/ResizeWithWindow/DefaultCS.aspx) for information as well.

    You can verify that the problem is not in our control, in case you replace the splitter with a simple DIV element, with "height:100%" style setting.

    Kind regards,
    Tsvetie
    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
  18. treesara
    treesara avatar
    11 posts
    Member since:
    Aug 2006

    Posted 02 Sep 2010 Link to this post

    In case it helps those in a similar situation, I was alble to finally fix this by defining an inline css style for the <div> tag which encloses the ContentPlaceHolder.  Abolute postioning was used in our case since we have defined header and footer areas.

    Another thing to point out is that this issue came forward as a result of IE8 (non compatibility mode).  The link below shows a similar solution as mentioned above.

    http://blogs.msdn.com/b/tolong/archive/2008/02/05/resize-the-contentplaceholder-in-the-master-page.aspx

    hth,
    Panit
  19. Rizwan
    Rizwan avatar
    30 posts
    Member since:
    Mar 2009

    Posted 13 Oct 2010 Link to this post

    Hi
      I am using latest telerik 2010.2.826.35. I have a scenario where a radsplitter is placed in another radsplitter. Before upgrading to SP1 . it was working fine but after upgrading it has started displaying horizontal scrollbars in IE-8 Native mode only. All others IE7, IE8 compatibility mode and Firefox are working fine.

    Is there any known issue in IE 8 Native or any patch which could help in fixing the horizontal scrollbar ?

    Best Regards
    Rizwan Bashir
  20. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 13 Oct 2010 Link to this post

    Hi Rizwan,

     When you nest a RadSplitter directly in a RadPane you should always set Scrolling="None" for the parent pane - if scrollbars are needed they will be generated by the nested splitter's panes.

    Please, set the property and let us know whether this resolved the problem.

    Kind regards,
    Svetlina
    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
  21. Rizwan
    Rizwan avatar
    30 posts
    Member since:
    Mar 2009

    Posted 13 Oct 2010 Link to this post

    Hi
       Yes its already same way as you suggested but still we have horizontal scrollbars.

    any other idea's ?

    Thanks
  22. Dobromir
    Admin
    Dobromir avatar
    1633 posts

    Posted 18 Oct 2010 Link to this post

    Hi Rizwan,

    To be able to provide any further assistance we will need reliable steps to reproduce the problem on our side. Could you please open a support ticket and provide a sample runnable project and / or a live URL reproducing the problem so we can investigate it further?

    Sincerely yours,
    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
  23. Andrew
    Andrew avatar
    5 posts
    Member since:
    Oct 2011

    Posted 09 Mar 2012 Link to this post

    I'm trying to the the control to be 100% of my page, without any luck.  I've noticed that when it renders the height is set to 400px.

    My markup has:
    <telerik:RadSplitter ID="rdSplitter" runat="server" Height="100%" Width="100%" ResizeWithBrowserWindow="true" ResizeMode="Proportional" ResizeWithParentPane="true">

    But the HTML that is rendered is:

    <div id="ctl00_plcMain_rdSplitter" style="width: 1912px; height: 400px;" control="[object Object]">
  24. Slav
    Admin
    Slav avatar
    1356 posts

    Posted 14 Mar 2012 Link to this post

    Hello Andrew,

    In order to achieve the desired effect you should ensure that the RadSplitter is not limited by the layout of your page.  Please check the online demo Splitter / Resize with Window for an example of the setup that you want to achieve.

    Kind regards,
    Slav
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  25. Jeremy
    Jeremy avatar
    96 posts
    Member since:
    Mar 2010

    Posted 15 Mar 2012 Link to this post

    grrrr none of these solutions worked for me in all of ie7/ie8/ie9/chrome - my client base.
    The below DOES work, but seems incredibly hacky. Why is the Splitter being wrapped in a div called RadSplitter1Panel? Why does this div have no height assigned? Why is the table generated being assigned a height of 1px? Why is the RadSplitter being assigned an inline height of 400px? <-- seems some kind of default as Andrew also mentioned it.

    html,body,form {
       margin: 0;
       padding: 0;
       height: 100%;
       overflow: hidden;
    }
     
    div[id*="RadSplitter1Panel"], div[id*="RadSplitter1Panel"] > div, div[id*="RadSplitter1Panel"] > div > table{
       height: 100% !important;
    }
     
    <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="100%" Height="100%">
       <telerik:RadPane ID="Pane1" runat="server" Height="100%" Scrolling="None">
          left pane
       </telerik:RadPane>
       <telerik:RadSplitBar ID="RadSplitBarFilter" runat="server" CollapseMode="Backward" />
       <telerik:RadPane ID="Pane2" runat="server" Width="420px" Height="100%" Scrolling="None">
          right pane
       </telerik:RadPane>
    </telerik:RadSplitter>
  26. Andrew
    Andrew avatar
    5 posts
    Member since:
    Oct 2011

    Posted 15 Mar 2012 Link to this post

    If it helps i finally got it working. My issue was with a table in my master page.  No matter what height I set in the table the control wouldn't go to 100%, always 400px.  Once I removed the table it started to work.
  27. John
    John avatar
    3 posts
    Member since:
    Feb 2012

    Posted 14 Nov 2012 Link to this post

    I have a related question. We are using a RadSplitter with a vertically oriented split bar and everything is fine. I am applying the autoheight style to RadPane #2 (on the right side with the vertically/horizontally growing content) and everything is fine. the width of the RadSplitter is 100% of the page width.

    The rightmost RadPane is set to allow X scrolling (horizontal) and this works fine.

    However, if the horizontal content within the rightmost pane is wider than the width of the pane, the pane begins to grow vertically uncontrollably and grows about 20 pixels every second until I drag the splitbar back to the left. If the horizontal width is less than that of the pane this behavior is not seen.

    Has anyone seen this behavior and what can I do to resolve it?
  28. Vessy
    Admin
    Vessy avatar
    1385 posts

    Posted 19 Nov 2012 Link to this post

    Hi John,

    Could you elaborate more on what exactly do you mean with "I am applying the autoheight style to RadPane #2"? I assume that you are setting a CSS property with height: auto !important? If so could you please try removing this class and see if the problem still occurs.

    Using such approach to provide automatically resize to the splitter according its content is highly not recommended. Instead you can use the approach provided in the following KB article:
    Initially Resize the RadSplitter according to its content

    If this is not the case, could you please provide a sample project reproducing the issue so we can examine it further?

    All the best,
    Vesi
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  29. Michael
    Michael avatar
    19 posts
    Member since:
    Oct 2011

    Posted 18 Jun 2013 Link to this post

    Like SO many others, I'm having the same issues here and now I also have this inline style height/width of 400px and I KNOW it isn't coming from ANY of my code or layout issues.

    UPDATE: I've ditched this control for the Kendo Splitter which is easier to use and less buggy.
  30. Vessy
    Admin
    Vessy avatar
    1385 posts

    Posted 19 Jun 2013 Link to this post

    Hello Michael,

    The 400px is the default height of the Splitter, and if it is displayed with such height the reason most probably is that there is a parent, which size is not configured. When you want to configure a RadSplitter in percentages, you have to make sure that all of its parents also have set size (up to a parent with a fixed size).

    If you decide to use the Splitter for ASP.NET AJAX, feel free to provide us with the exact markup, causing the undesired layout and we will do our best to narrow you down on how to configure the control properly.

    Regards,
    Veselina Raykova
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  31. Steve
    Steve avatar
    7 posts
    Member since:
    Jun 2012

    Posted 27 Jun 2013 Link to this post

    Hi Telerik

    As you/Michael rightly point out, why is the default height 400px? I note you have some javascript to correct this to 100% width/height on page load but on heavy HTML pages there is a nasty delay (esp. in IE), which for me is a deal breaker. If this must be done why isn't the splitter content hidden until it has been resized??

    I've considered the messy hack of doing a find/replace on "400px" to "100%" the HTML as it is written during the Render method, but not looked into this as yet.

    I've spent masses of time on this only to realise it's not worth the trouble for me and am now looking for alternatives.

    Sorry!
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017