This is a migrated thread and some comments may be shown as answers.

RadTextBox in RadPane not scrolling correctly in IE9 with Compatibility View turned on

1 Answer 62 Views

Splitter

This is a migrated thread and some comments may be shown as answers.

Jonah asked on 20 Mar 2012, 07:05 PM

I'm using nested RadSplitters and RadPanes to create a 3 pane layout that fills the browser window. The problem occurs in IE9 when "Compatibility View" is turned on: RadTextBox elements do not scroll with the other content in the pane, but instead remain fixed in the browser window (as if they had a position of "fixed"). Here is a page that demonstrates the problem:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="RadControlsWebApp1.WebForm2" %>

<!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 runat="server">

<title></title>

<style type="text/css">

html, body, form

{

height: 100%;

margin: 0px;

padding: 0px;

overflow: hidden;

}

</style>

</head>

<body>

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

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI"

Name="Telerik.Web.UI.Common.Core.js">

</asp:ScriptReference>

<asp:ScriptReference Assembly="Telerik.Web.UI"

Name="Telerik.Web.UI.Common.jQuery.js">

</asp:ScriptReference>

<asp:ScriptReference Assembly="Telerik.Web.UI"

Name="Telerik.Web.UI.Common.jQueryInclude.js">

</asp:ScriptReference>

</Scripts>

</telerik:RadScriptManager>

<div id="ParentDivElement" style="height: 100%;">

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

Orientation="Horizontal" PanesBorderSize="0" BorderSize="0">

<telerik:RadPane ID="TopPane" runat="server" Height="88"

Scrolling="none" CssClass="topPane" BorderStyle="None">

<h1>Top Menu Goes Here</h1>

</telerik:RadPane>

<telerik:RadSplitBar ID="HorizontalSplitterBar" runat="server" CollapseMode="None"></telerik:RadSplitBar>

<telerik:RadPane ID="MainPane" runat="server" Scrolling="none" MinWidth="500">

<telerik:RadSplitter ID="NestedSplitter" runat="server" LiveResize="true"

BorderStyle="None" CssClass="showTopBorder">

<telerik:RadPane ID="LeftPane" runat="server" Width="300">

<p>Side menu goes here</p>

</telerik:RadPane>

<telerik:RadSplitBar ID="VerticalSplitBar" runat="server" CollapseMode="None" />

<telerik:RadPane ID="ContentPane" runat="server" CssClass="valignPane">

<asp:Panel ID="Panel1" runat="server">

<div>

This is a RadTextBox: <telerik:RadTextBox ID="RadTextBox1" runat="server"></telerik:RadTextBox>

</div>

<div style="height:1200px">

This div is here to force the pane to have a scroll bar.

</div>

</asp:Panel>

</telerik:RadPane>

</telerik:RadSplitter>

</telerik:RadPane>

</telerik:RadSplitter>

</div>

</form>

</body>

</html>

RadTextBox in RadPane not scrolling correctly in IE9 with Compatibility View turned on

1 Answer, 1 is accepted