[1.1.1] form.column labelAlign ignored

[vtswingkid]

labelAlign in form.column seems to be ignored when form's labelAlign is set to something else.

i.e.

var form = new Ext.Form({labelAlign: 'right'})
form.add(....)
form.container()
form.column({},....)
form.column({labelAlign: 'left'},...) //this is ignored
form.end
form.add(...)
...


EDIT: it must be related to CSS
The containing div has "x-form-ct x-form-column x-form-label-left"
I changed it to "x-form-label-top" and that worked.
"left" and "right" both result in right

[mystix]

this is not a bug. it's the way css works.
the docs should be clearer though.

from the docs


labelAlign
labelAlign : String
Valid values are "left," "top" and "right" (defaults to "left"). This property cascades to child containers if not set.

the sentence "This property cascades to child containers if not set." is misleading and should read as
"This property cascades to child containers if set" instead.

an inspection of ext-all.css will reveal the same thing -- it's not possible to left-align the form's child elements if form-level labelAlign is set to something other than labelAlign:'left' simply because

the x-form-label-left rule is undefined, and actually depends on the default text-align:left css property of all HTML elements
css rules for x-form-label-right and x-form-label-top which get defined later would take precedence over x-form-label-left


the form-level labelAlign config should be treated as a convenience config, and should only be used if you're certain you won't be needing left-aligned fields later in the form, failing which inclusion of a higher specificity custom css rule is necessary in order to override the rules in ext-all.css.

a simple solution would be to set the labelAlign property on more specific groups (e.g. fieldsets, columns etc) instead of setting the config at the form-level, bearing in mind the config will still cascade down to all child elements within the group.