May 20, 2009, 12:19 PM
[CLOSED] Urgent layout problem
I've got the following page layout, and am having problems with making it work correctly within IE6. This page loads and displays fine in IE7 and IE8, but not IE6.
The problems in IE6 are:
- The "Comments" TextArea doesn't always display - only the associated label is visible.
- When the window is resized smaller, the first four fields disappear, and only the associated labels are visible.
- When the window is resized smaller, the two fieldsets don't scale down in size.
This is quite an urgent problem so I would appreciate some help as soon as possible, please.
I've tried to cut the following code down as much as possible.
Many thanks,
Dan
The problems in IE6 are:
- The "Comments" TextArea doesn't always display - only the associated label is visible.
- When the window is resized smaller, the first four fields disappear, and only the associated labels are visible.
- When the window is resized smaller, the two fieldsets don't scale down in size.
This is quite an urgent problem so I would appreciate some help as soon as possible, please.
I've tried to cut the following code down as much as possible.
Many thanks,
Dan
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TestPage5.aspx.cs" Inherits="TestPage5" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager1" runat="server" Theme="Default" />
<ext:ViewPort ID="vptMain" runat="server" MonitorResize="true">
<Body>
<ext:ColumnLayout ID="ColumnLayout2" runat="server" FitHeight="true">
<ext:LayoutColumn ColumnWidth="1">
<ext:TabPanel TabPosition="Bottom" Shim="true" ID="TabPanel1" DeferredRender="false" runat="server" ActiveTabIndex="0" Title="TabPanel">
<Tabs>
<ext:Tab runat="server" ID="tab4" Icon="Cog" Title="Tab1" StyleSpec="padding: 6px;">
<Body>
<ext:ColumnLayout ID="cmlMain" runat="server" FitHeight="true">
<ext:LayoutColumn ColumnWidth=".50">
<ext:Panel runat="server" Frame="true">
<Body>
<ext:Label runat="server" Text="Test"></ext:Label>
</Body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".50">
<ext:Panel StyleSpec="padding-left: 6px;" runat="server" Border="false">
<Body>
<ext:FitLayout ID="FitLayout1" runat="server">
<ext:FormPanel
Title="Details"
Frame="true"
id="frmDetails"
AutoScroll="true"
BodyStyle="border: 1px solid #99bbe8;"
runat="server">
<Body>
<ext:ContainerLayout ID="ContainerLayout1" runat="server">
<ext:FormPanel
BodyStyle="padding-left: 6px; padding-top: 6px; padding-right: 6px; padding-bottom: 0px;"
ID="pnlDetails1"
runat="server">
<Body>
<ext:FormLayout ID="FormLayout1" runat="server">
<ext:Anchor Horizontal="100%">
<ext:TextField
id="txtTitle"
runat="server"
MaxLength="255"
AllowBlank="false"
Validateonblur="false"
FieldLabel="Field 1">
</ext:TextField>
</ext:Anchor>
<ext:Anchor Horizontal="100%">
<ext:ComboBox
id="cboType1"
runat="server"
FieldLabel="Field 2"
AllowBlank="false"
Mode="Local"
Validateonblur="false"
EmptyText="(Select)"
DisplayField="TypeTitle"
ValueField="TypeID"
TriggerAction="All">
</ext:ComboBox>
</ext:Anchor>
<ext:Anchor Horizontal="100%">
<ext:ComboBox
id="cboType2"
runat="server"
FieldLabel="Field 3"
AllowBlank="false"
Mode="Local"
Validateonblur="false"
EmptyText="(Select)"
DisplayField="TypeTitle"
ValueField="TypeID"
TriggerAction="All">
</ext:ComboBox>
</ext:Anchor>
<ext:Anchor Horizontal="100%">
<ext:TextField
id="txtTest"
runat="server"
MaxLength="255"
FieldLabel="Field 4">
</ext:TextField>
</ext:Anchor>
</ext:FormLayout>
</Body>
</ext:FormPanel>
<ext:FormPanel
BodyStyle="padding-left: 6px; padding-top: 6px; padding-right: 6px; padding-bottom: 0px;"
ID="pnlDetails2" AutoWidth="false"
runat="server">
<Body>
<ext:FieldSet AutoWidth="true" ID="flds1" runat="server" Title="Example">
<Body>
<ext:ColumnLayout ID="ColumnLayout4" runat="server">
<ext:LayoutColumn ColumnWidth=".375">
<ext:Panel ID="pnlDetails3" runat="server" Border="false" Header="false">
<Body>
<ext:FormLayout ID="FormLayout4" StyleSpec="padding-right: 4px;" runat="server" LabelAlign="Top">
<ext:Anchor Horizontal="100%">
<ext:ComboBox
id="cboType3"
runat="server"
FieldLabel="Type"
AllowBlank="false"
Mode="Local"
TriggerAction="All">
</ext:ComboBox>
</ext:Anchor>
</ext:FormLayout>
</body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".375">
<ext:Panel ID="pnlDetails4" runat="server" Border="false" Header="false">
<Body>
<ext:FormLayout ID="FormLayout5" StyleSpec="padding-right: 4px;" runat="server" LabelAlign="Top">
<ext:Anchor Horizontal="100%">
<ext:ComboBox
id="cboType4"
runat="server"
FieldLabel="Type"
AllowBlank="false"
Mode="Local"
TriggerAction="All">
</ext:ComboBox>
</ext:Anchor>
</ext:FormLayout>
</body>
</ext:Panel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".25">
<ext:Panel ID="pnlDetails5" runat="server" Border="false" Header="false">
<Body>
<ext:FormLayout ID="FormLayout6" runat="server" LabelAlign="Top">
<ext:Anchor Horizontal="100%">
<ext:TextField
id="txtType5"
runat="server"
FieldLabel="Type"
StyleSpec="text-align: center;"
ReadOnly="true">
</ext:TextField>
</ext:Anchor>
</ext:FormLayout>
</body>
</ext:Panel>
</ext:LayoutColumn>
</ext:ColumnLayout>
</Body>
</ext:FieldSet>
</Body>
</ext:FormPanel>
<ext:FormPanel
BodyStyle="padding-left: 6px; padding-top: 6px; padding-right: 6px; padding-bottom: 0px;"
ID="pnlDetails6"
runat="server">
<Body>
<ext:FieldSet ID="FieldSet1" runat="server" Title="Example">
<Body>
<ext:ColumnLayout ID="ColumnLayout5" runat="server">
<ext:LayoutColumn ColumnWidth=".375">
<ext:FormPanel ID="pnlDetails7" runat="server" Border="false" Header="false">
<Body>
<ext:FormLayout ID="FormLayout7" StyleSpec="padding-right: 4px;" runat="server" LabelAlign="Top">
<ext:Anchor Horizontal="100%">
<ext:ComboBox
id="cboType6"
runat="server"
FieldLabel="Type"
AllowBlank="false"
Mode="Local"
TriggerAction="All">
</ext:ComboBox>
</ext:Anchor>
</ext:FormLayout>
</body>
</ext:FormPanel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".375">
<ext:FormPanel ID="pnlDetails8" runat="server" Border="false" Header="false">
<Body>
<ext:FormLayout ID="FormLayout8" StyleSpec="padding-right: 4px;" runat="server" LabelAlign="Top">
<ext:Anchor Horizontal="100%">
<ext:ComboBox
id="cboType7"
runat="server"
FieldLabel="Type"
AllowBlank="false"
Mode="Local"
TriggerAction="All">
</ext:ComboBox>
</ext:Anchor>
</ext:FormLayout>
</body>
</ext:FormPanel>
</ext:LayoutColumn>
<ext:LayoutColumn ColumnWidth=".25">
<ext:FormPanel ID="pnlDetails9" runat="server" Border="false" Header="false">
<Body>
<ext:FormLayout ID="FormLayout9" runat="server" LabelAlign="Top">
<ext:Anchor Horizontal="100%">
<ext:TextField
id="txtType8"
runat="server"
FieldLabel="Type"
StyleSpec="text-align: center;"
ReadOnly="true">
</ext:TextField>
</ext:Anchor>
</ext:FormLayout>
</body>
</ext:FormPanel>
</ext:LayoutColumn>
</ext:ColumnLayout>
</Body>
</ext:FieldSet>
</Body>
</ext:FormPanel>
<ext:FormPanel
BodyStyle="padding-left: 6px; padding-top: 6px; padding-right: 6px; padding-bottom: 0px;"
ID="pnlDetails14"
runat="server">
<Body>
<ext:FormLayout ID="FormLayout2" runat="server">
<ext:Anchor Horizontal="100%">
<ext:TextArea
id="txtComments"
runat="server"
MaxLength="65536"
Height="100"
FieldLabel="Comments">
</ext:TextArea>
</ext:Anchor>
</ext:FormLayout>
</Body>
</ext:FormPanel>
</ext:ContainerLayout>
</Body>
<BottomBar>
<ext:Toolbar Height="26" StyleSpec="padding-left: 8px;" ID="Toolbar2" runat="server">
<Items>
<ext:Label Text="Test label" runat="server"></ext:Label>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:FormPanel>
</ext:FitLayout>
</Body>
</ext:Panel>
</ext:LayoutColumn>
</ext:ColumnLayout>
</body>
</ext:Tab>
</Tabs>
</ext:TabPanel>
</ext:LayoutColumn>
</ext:ColumnLayout>
</Body>
</ext:ViewPort>
</form>
</body>
</html>