7 Replies Latest reply on Aug 4, 2009 1:34 PM by Gregory Lafrance

    CSS size text

    Jerry62712 Level 1

      I tried to set the width of a label using css and the "text-field-width" property that popped up from the Flex Builder.  But it didn't work.  What will work?

        • 1. Re: CSS size text
          Gregory Lafrance Level 6

          I don't think you can change the width of a label control in CSS in Flex.

           

          If this post answered your question or helped, please mark it as such.

          1 person found this helpful
          • 2. Re: CSS size text
            Jerry62712 Level 1

            I'm guessing you are right.  I wonder what that css property is there for if not to do that.  Do you know if it will work in Flex 4?

            • 3. Re: CSS size text
              joan_lafferty Adobe Employee

              Sorry Greg, this won't work in Flex 4 either. The width of a Label is controlled by the width property and not a style. Therefore, it won't be settable in CSS.

               

              Joan

              • 4. Re: CSS size text
                Jerry62712 Level 1

                I noticed that if I set "Text" in css, it is reflected in text fields and the size of the container adjusts.  If I then set the fontSize in ActionScript, I can get the size to change, but the container (a panel in this case) doesn't change causing a loss of data.

                 

                1) How can I change "Text" in the css from ActionScript?

                2) Will this change the container to allow for the different sizes?

                3) How cqan I change the fontSize in ActionScript and have the container change?

                 

                Here is a component of the mxml:

                 

                <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">

                 

                <mx:Script>
                    <![CDATA[
                        [Bindable] public var noticeTitle:String;
                        [Bindable] public var noticeTop:String;
                        [Bindable] public var noticeList:String;
                        [Bindable] public var noticeBottom:String;
                    ]]>
                </mx:Script>

                 

                <!-- ***************************************************************** -->
                <!-- ** start of the notices area ************************************ -->
                    <mx:Panel id="noticeCompPanel"
                        cornerRadius="20"
                        backgroundColor="#d5d5d5"
                        borderColor="#000000"
                        x="5" y="0"
                        roundedBottomCorners="true"
                        headerHeight="16" width="655"
                        layout="vertical"
                        verticalScrollPolicy="off" horizontalScrollPolicy="off"
                        tabEnabled="true" tabIndex="310">

                 

                        <mx:Text id="noticeCompTitle"
                            htmlText="{noticeTitle}"
                            fontSize="18"
                            paddingLeft="275"
                            width="100" />

                 

                        <mx:Text id="noticeCompTop"
                            htmlText="{noticeTop}"
                            width="100%"
                            left="10" />

                 

                        <mx:Text id="noticeCompList"
                            htmlText="{noticeList}"
                            leading=".5"
                            paddingRight="25"
                            width="100%" />

                 

                        <mx:Text id="noticeCompBottom"
                            htmlText="{noticeBottom}"
                            width="90%"
                            paddingLeft="10" />
                    </mx:Panel>
                </mx:Canvas>

                • 5. Re: CSS size text
                  Gregory Lafrance Level 6

                  I'm not aware of a "Text" style in Flex, but if it exists you change it in AS with:

                   

                  myComponent.setStyle("Text", "newValue")

                   

                  with the double-quotes unnecessary for numeric values.

                   

                  2) Will this change the container to allow for the different sizes? DONT KNOW

                   

                  3) How can I change the fontSize in ActionScript and have the container change?

                   

                  myComponent.setStyle("fontSize", 20)        but the container might not change.

                   

                  If this post answered your question or helped, please mark it as such.

                  1 person found this helpful
                  • 6. Re: CSS size text
                    Jerry62712 Level 1

                    That resizing seems to be a problem. Sigh.

                     

                    Text, like Button or Label are selectors in the Flex world.

                    • 7. Re: CSS size text
                      Gregory Lafrance Level 6

                      Oh, you mean ther Text component, then this should work:

                       

                      <mx:Style>

                          Text {

                              fontSize: 20;

                          }

                      </mx:Style>