2 Replies Latest reply on Dec 10, 2009 12:17 PM by PanicT

    Flex CSS


      I'm trying to use CSS style sheet in flex and having some issues with it need some help...

      In my /src/styles/styles.css for now I just have the following:









      In my /src/Test.mxml I have the following:

      <?xml version="1.0"?>
      <mx:Application xmlns:mx=http://www.adobe.com/2006/mxml width="1000" height="700">

          <mx:VBox width="800" height="800">
              <mx:HBox borderStyle="solid">
                  <mx:Button id="searchButton"
                      label="Search Screen"


                  <mx:Button id="cInfoButton"
                      label="Customer Info Screen"


                  <mx:Button id="aInfoButton"
                      label="Account Info Screen"


              <mx:ViewStack id="myViewStack"
                  borderStyle="solid" width="100%">


                  <mx:Canvas id="search" label="Search">
                      <mx:Label text="Search Screen"/>


                  <mx:Canvas id="custInfo" label="Customer Info">
                      <mx:Label text="Customer Info"/>


                  <mx:Canvas id="accountInfo" label="Account Info">
                      <mx:Label text="Account Info"/>

      How to Implement Styles.css in here...

      Like If it has to be

      1. Yellow background color for the application and components

      2. fontFamily="Arial", fontSize="16" height="30" for the buttons

      3. fontFamily="Arial", fontSize="16" for the text (in view stack)

      4. Top Bottom left right are set to 10 from each side...

      Any help is appreciated...

        • 1. Re: Flex CSS
          RosieGp Level 1

          Is it easy to get to and that I have to figure it out myself or too lengthy to get into...

          • 2. Re: Flex CSS

            Here is an example of importing from within flex the styles you want. You can also have it in a separate CSS file.


                    @namespace s "library://ns.adobe.com/flex/spark";
                    @namespace mx "library://ns.adobe.com/flex/halo";
                    @namespace el "components.elements.*";
                    @namespace ui "components.*";
                    mx|BarChart {
                        **Styles here**


            1 person found this helpful