My problem is that when I set the enclosing splitter to 100% width and height (I would like to have everything resize automatically as the window size changes) everything stretches to the working area size instead of the parent element. Below is an example of my page.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="panel.aspx.cs" Inherits="tests_panel" %> |
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %> |
<!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 id="Head1" runat="server"> |
<title>Untitled Page</title> |
<style type="text/css"> |
html, |
body, |
form |
{ |
margin: 0; |
height: 100%; |
border: 0; |
padding: 0; |
overflow: hidden; |
} |
#rsMain {margin:10px;} |
#rpBody {padding:10px; } |
</style> |
</head> |
<body> |
<form id="form1" runat="server"> |
<telerik:RadScriptManager ID="RadScriptManager1" runat="server"> |
</telerik:RadScriptManager> |
<telerik:RadSplitter ID="rsMain" runat="server" Orientation="Horizontal" Width="100%" Height="100%"> |
<telerik:RadPane ID="rpHeader" runat="server" Height="30" BackColor="Green">Header</telerik:RadPane> |
<telerik:RadPane ID="rpBody" runat="server" BackColor="yellow"> |
<telerik:RadSplitter ID="body" runat="server"> |
<telerik:RadPane ID="rpLeft" runat="server" Width="300"> |
left |
</telerik:RadPane> |
<telerik:RadSplitBar Id="splitbar" runat="server"/> |
<telerik:RadPane ID="rpRight" runat="server"> |
right |
</telerik:RadPane> |
</telerik:RadSplitter> |
</telerik:RadPane> |
<telerik:RadPane ID="rpFooter" runat="server" Height="30" BackColor="Blue">Footer</telerik:RadPane> |
</telerik:RadSplitter> |
</form> |
</body> |
</htm>l |