5 Replies Latest reply on Mar 18, 2011 2:24 PM by rtalton

    How to style form labels?

    cut-copy-paste Level 1

      I'm using a (mx) form and I see absolutely no way to style the labels for the fields.  Is this for real? There has got to be a way...

        • 1. Re: How to style form labels?
          Raghuvasa Level 1

          We can override the styles by using external css file

          • 2. Re: How to style form labels?
            cut-copy-paste Level 1

            Can I style only the labels with CSS?

            I have applied styles to the formItems and it affects everything so I have to reset styles of everything else in the form which is not ideal.

            • 3. Re: How to style form labels?
              Angela's ARIA

              Hi cut-copy-paste,


              If you have a form similar to this:


                        <mx:FormItem label="Name :"                          styleName="formTitle">

                             <mx:TextInput id="senderName" />


                        <mx:FormItem label="Email :"                          styleName="formLabel">

                             <mx:TextInput id="senderEmail" />




              You can link to a style sheet:

                   <fx:Style source="content-text-style.css"/>


              Where you can apply styles to the form components by naming them or naming classes that are applied to the components:

                   @namespace mx "library://ns.adobe.com/flex/mx";

                   mx|FormItem { fontSize: 10; }

                   mx|TextInput { fontSize: 12; }

                   mx|Button { fontSize: 12; }


                   .formTitle { fontSize: 20; }

                   .formLabel { fontSize: 12; }


              As the mx:TextInput component is placed within the mx:FormItem component  this may cause the style to be inherited.  Try specifying the styles  you want to apply to the mx:TextInput also.


              I hope that you find this helpful.


              Angela's ARIA
              Accessible Rich Internet Application

              • 4. Re: How to style form labels?
                cut-copy-paste Level 1

                I was aware you could use class names etc, yeah.


                I guess basically the answer is that you can't style the labels independently of the things that they contain, which is too bad.

                • 5. Re: How to style form labels?
                  rtalton Level 4

                  You were sooo close!

                  On your FormItem, simply set the "labelStyleName" property, NOT the "styleName".


                  /* CSS file */






                  color: #FF4800;


                  fontSize: 12;



                  <?xml version="1.0" encoding="utf-8"?>





















                  First Name"












                  <mx:Style source="styles.css"/>