Splitter height/width expanding beyond browser

2 posts, 0 answers
  1. David
    David avatar
    10 posts
    Member since:
    Nov 2010

    Posted 07 Jun 2012 Link to this post

    <style type="text/css">
      html, form
      {
        height: 100%;
        margin: 0px;
        padding: 0px;
      }
     
      body
      {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #333;
        height: 100%;
        margin: 0px;
        padding: 0px;
        background-color: #ffffff;
      }
       
      .topBar
      {
        width: 100%;
        padding: 5px;
        height: 35px;
        display: block;
        background-color: #336699;
      }
       
      .topBarLogo
      {
      
      }
    </style>

    <body>
    <form id="form1" runat="server">
    <div class="topBar">
    <table width="100%">
    <tr>
    <td><div class="topBarLogo"><img src="/_Images/logo.png" /></div></td>
    <td width="100"><a href="\login.aspx?logout=true" class="button">Logout</a></td>
    </tr>
    </table>
    </div>
     
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSplitter ID="RadSplitter1" runat="server" Height="100%" Width="100%" BorderSize="0">
    <telerik:RadPane ID="navigationPane" runat="server" Width="250px" BackColor="#ffffff" Scrolling="Y">
    <div class="LeftPane">
    My Nav menu
    </div>
    </telerik:RadPane>
    <telerik:RadSplitBar ID="RadSplitbar1" runat="server" CollapseMode="Forward" />
    <telerik:RadPane ID="contentPane" runat="server" ContentUrl="/login.aspx" BackColor="White">
    </telerik:RadPane>
    </telerik:RadSplitter>
    </form>
    </body>

    The RadSplitter is rendering with both the browser's horizontal and vertical scrollbars. I suspect it has to do with the topBar div - but I want the splitter to be 100% of the remaining width/height of the browser after the topBar?

  2. David
    David avatar
    10 posts
    Member since:
    Nov 2010

    Posted 08 Jun 2012 Link to this post

    I fixed this by nesting the existing Splitter in a parent Splitter, and putting the topBar in a third RadPane.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top