Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Apr 2007
    Posts
    57
    Vote Rating
    2
    zachext is on a distinguished road

      0  

    Default [OPEN-1087] FormPanel labelAlign does not override in fieldset

    [OPEN-1087] FormPanel labelAlign does not override in fieldset


    Ext version tested:
    • Ext 3.2.1

    Adapter used:
    • ext

    css used:
    • only default ext-all.css



    Browser versions tested against:
    • IE8
    • FF3 (firebug 1.3.0.10 installed)

    Operating System:
    • Win 7

    Description:
    • When specifying a labelAlign of top for a FormPanel and then specifying a labelAlign of left for a contained fieldset, the css class .x-form-label-top applies to labels of fieldset items.

    Test Case:

    Code:
       Ext.onReady(function () {
              
               new Ext.form.FormPanel({
                   renderTo: Ext.getBody(),
                   labelAlign:'top',
                   items: [
                            {fieldLabel:'field 1', xtype:'textfield'},
                           
                            { xtype:'fieldset', labelAlign:'left', title:'fieldset',
                                items: [{ fieldLabel: 'field 2', xtype: 'textfield' }]
                            }
                          ]
               })
    
           })
    Possible Solution:

    Add the following css to ext-all.css

    Code:
    .x-form-label-left .x-form-item label.x-form-item-label {
        width:auto;
        float:left;
        clear:left;
        display:block;  
        position:relative;
    }
    
    .x-form-label-left .x-form-element {   
        padding-top:0px;
    }
    
    .x-form-label-left .x-form-item {
        padding-top:0px;
    }
    Last edited by zachext; 30 Jun 2010 at 3:02 PM. Reason: Added possible fix

  2. #2
    Sencha User
    Join Date
    May 2008
    Posts
    19
    Vote Rating
    0
    samsonasu is on a distinguished road

      0  

    Default


    I have the same problem, Ext 3.2.1. Your CSS didn't quite work, I needed one more level of specification on the top rule, and I also needed a little bit of margin (4px) on the label so it aligned to the center of the text field it was next to.

    Code:
    .x-form-label-left .x-fieldset-body .x-form-item label.x-form-item-label {
        width:auto;
        float:left;
        clear:left;
        display:block;  
        position:relative;
        margin-top: 4px;
    }
    edit: This was in linux on FF4 and Google chrome. The css patch fixes both browsers.

Similar Threads

  1. decouple FormPanel and LabelAlign
    By bjwaski in forum Ext GWT: Bugs (2.x)
    Replies: 0
    Last Post: 11 Feb 2010, 8:41 AM
  2. [2.0] FieldSet labelAlign
    By trbs in forum Community Discussion
    Replies: 13
    Last Post: 2 Apr 2009, 8:17 PM
  3. FormPanel: Custom labelAlign for just one field?
    By jove4015 in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 6 Apr 2008, 2:20 PM

Thread Participants: 1