Hi there,
I have a radsplitter on 100% height. Everything seems to be working fine until I attach a AjaxUpdatedControl to the radsplitter.
Once I attach the AjaxUpdatedControl, the height of the radsplitter seems to be fixed at a particular height. You can refer to the 2 files to see the difference.
Below are my code
Btw, this only happens in Chrome. It works fine in IE8 and Opera. Haven't tested on FF.
I have a radsplitter on 100% height. Everything seems to be working fine until I attach a AjaxUpdatedControl to the radsplitter.
Once I attach the AjaxUpdatedControl, the height of the radsplitter seems to be fixed at a particular height. You can refer to the 2 files to see the difference.
Below are my code
Btw, this only happens in Chrome. It works fine in IE8 and Opera. Haven't tested on FF.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="page_defaultmainpage.aspx.cs" Inherits="TravelBooking.page_defaultmainpage" %>
<%@ 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"
>
<
meta
http-equiv
=
"X-UA-Compatible"
content
=
"IE=7"
/>
<
title
>ONLINE SYSTEM</
title
>
<
style
type
=
"text/css"
>
html, body, form
{
margin: 0px;
padding: 0px;
height: 100%;
width: 100%;
overflow: hidden;
}
</
style
>
</
head
>
<
body
style
=
"height: 100%; margin: 0px; overflow: hidden;"
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"ExRadScriptManager"
runat
=
"server"
>
</
telerik:RadScriptManager
>
<
telerik:RadAjaxManager
ID
=
"ExRadAjaxManager"
runat
=
"server"
>
<
AjaxSettings
>
<
telerik:AjaxSetting
AjaxControlID
=
"LeftPane"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"MainSplitter"
LoadingPanelID
=
"LoadingPanelAnimated"
UpdatePanelRenderMode
=
"Inline"
>
</
telerik:AjaxUpdatedControl
>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
</
AjaxSettings
>
</
telerik:RadAjaxManager
>
<
telerik:RadAjaxLoadingPanel
ID
=
"LoadingPanelAnimated"
runat
=
"server"
BackColor
=
"White"
Transparency
=
"38"
MinDisplayTime
=
"3000"
Height
=
"800px"
>
<
table
cellpadding
=
"0"
cellspacing
=
"0"
style
=
"width: 100%; height: 100%;"
>
<
tr
>
<
td
align
=
"center"
valign
=
"middle"
style
=
"padding-bottom: 100px"
>
<
img
alt
=
"Loading..."
src
=
'images/ajax-loader.gif'
style
=
"border: 0;"
/>
</
td
>
</
tr
>
</
table
>
</
telerik:RadAjaxLoadingPanel
>
<
table
style="border-style: solid; border-width: 0px 0px 2px 0px; border-color: #808080;
width: 100%;">
<
tr
>
<
td
width
=
"480"
>
<
asp:ImageButton
ID
=
"ImageButton1"
runat
=
"server"
ImageUrl
=
""
PostBackUrl
=
"~/management.aspx"
Height
=
"110px"
/>
</
td
>
<
td
>
<
asp:Label
ID
=
"Label1"
runat
=
"server"
Font-Bold
=
"True"
Font-Names
=
"Verdana"
Font-Size
=
"13pt"
Text
=
"MAIN MANAGEMENT"
></
asp:Label
>
</
td
>
</
tr
>
</
table
>
<
div
runat
=
"server"
id
=
"super"
style
=
"width: 100%; height: 100%; background-color: #FF0000;"
>
<
telerik:RadSplitter
ID
=
"MainSplitter"
runat
=
"server"
Skin
=
"Black"
Width
=
"100%"
Height
=
"100%"
HeightOffset
=
"148"
VisibleDuringInit
=
"false"
>
<
telerik:RadPane
ID
=
"LeftPane"
runat
=
"server"
Width
=
"200px"
BackColor
=
"Black"
BorderStyle
=
"Solid"
>
<
div
style
=
"margin-top: 10px; margin-left: 8px; background-color: #000000;"
>
<
telerik:RadTreeView
ID
=
"ExLeftNavigator"
runat
=
"server"
Skin
=
"Black"
Font-Bold
=
"True"
Font-Names
=
"Tahoma"
Font-Size
=
"8pt"
>
<
Nodes
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Management"
Expanded
=
"True"
>
<
Nodes
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Option One"
>
</
telerik:RadTreeNode
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Option Two"
>
</
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeNode
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Booking Schedule"
Expanded
=
"True"
>
<
Nodes
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Option Three"
>
</
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeNode
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Others"
>
</
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeView
>
</
div
>
</
telerik:RadPane
>
<
telerik:RadSplitBar
ID
=
"RadSplitBar1"
runat
=
"server"
/>
<
telerik:RadPane
ID
=
"ContentPane"
runat
=
"server"
BackColor
=
"White"
>
</
telerik:RadPane
>
</
telerik:RadSplitter
>
<
table
style="border: 1px solid #808080; width: 100%; background-color: #000000;
height: 30px;">
<
tr
>
<
td
width
=
"480"
>
<
asp:Label
ID
=
"Label3"
runat
=
"server"
Text
=
"Current Page:"
Font-Bold
=
"True"
Font-Names
=
"Tahoma"
Font-Size
=
"9pt"
ForeColor
=
"White"
></
asp:Label
>
<
asp:Label
ID
=
"lbCurrentPage"
runat
=
"server"
Font-Bold
=
"True"
Font-Names
=
"Tahoma"
Font-Size
=
"9pt"
ForeColor
=
"White"
></
asp:Label
>
</
td
>
<
td
>
</
td
>
</
tr
>
</
table
>
</
div
>
</
form
>
</
body
>
</
html
>