Here’s a quick little tip. In case you are trying to align a form label to the left and can’t get it to align, you will find that textAlign left which should work according to the LiveDoc doesn’t work on all Flex SDK versions. Apparently this is a known bug in Adobe’s JIRA system:
http://bugs.adobe.com/jira/browse/SDK-12776.
Adobe SDK team added a new property to the FormItem component called: labelStyleName.
Here’s the solution. Create a style sheet and use text-align: left.
<fx:Style>
.formItemLabelLeft {
text-align: left;
}
</fx:Style>
Next, attach the CSS to the labelStyleName property.
<mx:Form> <mx:FormItem label="Label Name:" width="148" labelStyleName="formItemLabelLeft"> <mx:ComboBox editable="true" width="79"></mx:ComboBox> </mx:FormItem>
This was tested in Flex 4 beta SDK.
If you don’t want to add labelStyleName=”formItemLabelLeft” to each form item, since labelStyleName is style itself, you can do this
.formItemLabelLeft {
text-align: left;
}
FormItem {
labelStyleName: “formItemLabelLeft”;
}
Thanx Chaim, relevant information. For some reason Flex 4 has a bug and doesn’t support CSS type selector for FormItem, when you try:
<fx:Style>
@namespace mx “library://ns.adobe.com/flex/halo”;
mx|FormItem {
labelStyleName: “formItemLabelLeft”;
}
.formItemLabelLeft {
text-align: left;
}
</fx:Style>
You get: CSS type selectors are not supported in components: ‘mx.containers.FormItem’
Filed a Jira bug: https://bugs.adobe.com/jira/browse/FB-21764