Aug 26, 2015, 1:51 PM
[CLOSED] FormLayout overrides the label width
Hi,
I've observed that setting Panel layout to "FormLayout" messes with its nested elements' label attributes. In the test case below, FieldContainer Label width seems to be superseded by the x-form-layout-auto-label class. Please refer to the image attached.
I've observed that setting Panel layout to "FormLayout" messes with its nested elements' label attributes. In the test case below, FieldContainer Label width seems to be superseded by the x-form-layout-auto-label class. Please refer to the image attached.
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<style>
.read-only-label {
color: #696969;
border-width: 1px;
border-style: double;
border-color: #C6CBDA;
height: 14px;
background-color: #F2F6FB;
text-overflow: ellipsis !important;
white-space: nowrap !important;
overflow: hidden !important;
width: 100%;
}
</style>
<!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>Ext.Net 2.x</title>
<ext:ResourcePlaceHolder ID="ResourcePlaceHolder1" runat="server" Mode="Script" />
<ext:ResourcePlaceHolder ID="ResourcePlaceHolder2" runat="server" Mode="Style" />
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server">
</ext:ResourceManager>
<ext:Viewport runat="server" Layout="FitLayout">
<Items>
<ext:Panel runat="server" Height="200" Layout="FormLayout">
<Items>
<ext:FieldContainer runat="server" FieldLabel="Name" LabelWidth="200" AnchorHorizontal="100%" Layout="HBoxLayout">
<Items>
<ext:DisplayField runat="server" Width="280" Cls="read-only-label">
</ext:DisplayField>
<ext:ToolbarSpacer Width="30">
</ext:ToolbarSpacer>
<ext:DisplayField runat="server" Text="Title:" Width="80">
</ext:DisplayField>
<ext:DisplayField runat="server" Width="280" Cls="read-only-label">
</ext:DisplayField>
</Items>
</ext:FieldContainer>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
Last edited by Daniil; Aug 26, 2015 at 4:16 PM.
Reason: [CLOSED]
