[CLOSED] FormPanel field label spacing

  1. #1

    [CLOSED] FormPanel field label spacing

    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
    </head>
    <body>
        <ext:ResourceManager runat="server" Theme="Gray" ScriptMode="Debug" />
        <ext:FormPanel Title="Ext.Net 2.x" Margin="10" Width="200" runat="server">
            <FieldDefaults LabelAlign="Top"  />
            <Items>
                <ext:TextField FieldLabel="Field 1" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 2" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 3" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 4" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 5" AnchorHorizontal="100%" runat="server" />
            </Items>
        </ext:FormPanel>
    </body>
    </html>
    On version 2.x, the label closer to the field


    than on version 3.x


    It's possible to overcome the issue above by doing the following:

    <!DOCTYPE html>
    <html>
    <head id="Head1" runat="server">
        <style type="text/css">
            .x-form-item-label-default {
                min-height: 15px !important;
            }
    
            .x-form-item-label-top.x-form-item-label-default > .x-form-item-label-inner {
                padding-bottom: 0px !important;
            }
        </style>
    </head>
    <body>
        <ext:ResourceManager runat="server" Theme="Gray" ScriptMode="Debug" />
        <ext:FormPanel Title="Ext.Net 3.x" Margin="10" Width="200" runat="server">
            <FieldDefaults LabelAlign="Top" />
            <Items>
                <ext:TextField FieldLabel="Field 1" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 2" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 3" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 4" AnchorHorizontal="100%" runat="server" />
                <ext:TextField FieldLabel="Field 5" AnchorHorizontal="100%" runat="server" />
            </Items>
        </ext:FormPanel>
    </body>
    </html>
    Attached Thumbnails Click image for larger version. 

Name:	fl001.jpg 
Views:	27 
Size:	6.1 KB 
ID:	17611   Click image for larger version. 

Name:	fl002.jpg 
Views:	27 
Size:	6.4 KB 
ID:	17621   Click image for larger version. 

Name:	fl003.jpg 
Views:	27 
Size:	6.1 KB 
ID:	17631  
    Last edited by Daniil; Dec 27, 2014 at 7:28 PM. Reason: [CLOSED]
  2. #2
    Hi Raphael,

    Agree, that slight difference might annoy. I think your solution is good.
  3. #3
    Thank you Daniil. Please mark this thread as closed.

Similar Threads

  1. [CLOSED] FormPanel anchor and label align issues
    By RCN in forum 3.x Legacy Premium Help
    Replies: 2
    Last Post: Nov 25, 2014, 7:23 PM
  2. Replies: 2
    Last Post: Oct 24, 2013, 11:53 AM
  3. [CLOSED] Remove the spacing between field in a formlayout
    By sadaf in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 23, 2012, 1:37 PM
  4. Replies: 4
    Last Post: Jul 29, 2011, 7:02 AM
  5. [CLOSED] Formpanel and Label (bug?)
    By CMA in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 26, 2009, 7:26 AM

Posting Permissions