3 Replies Latest reply on Aug 13, 2009 6:33 AM by Jerry62712

    How Do I: CSS to work?

    Jerry62712 Level 1

      I have an application.  I put a control to switch between high contrast (background of white) and normal contrast (background of light brown/grey).

       

      I tried this with using CSS and switching between two style sheets.  Results were variable - sometimes they worked, sometimes they didn't.  I've got it more stable now, but have a problem.  I switch the background to white on the Text selector, but two of the fields are in foreground color of white.  So I changed it to green in the normal CSS and red in the high contrast CSS.  The red never shows up.

       

      Further, I'd like to remove all color from the background in those two fields when the normal CSS is used.

       

      1) How do I get the font color to change?

      2) How do I get the background color to become transparent?

       

      CSS normal:


      .headingText {
          color: #00ff00;
          font-family: Ariel;
          font-weight: bold;
          }

       

      (only green for testing - will become white when it works)

       

      CSS high contrast:

       

      .headingText {
          color: #ff0000;
          }

       

      Text objects:

       

              <mx:VBox id="headerText"
                  x="6" y="40"
                  width="50%">
                  <mx:Text id="headerSNAPText"
                      text="Supplement Nutrition Assistance Program"
                      fontSize="15"
                      styleName="headingText"/>

       

                  <mx:Text id="headerIDHSText"
                      text="Illinois Department of Human Resources"
                      fontSize="18"
                      styleName="headingText"/>
              </mx:VBox>

        • 1. Re: How Do I: CSS to work?
          EWN-CMI Level 1

          I have only used CSS to skin buttons for the most part, in your example I would add a State. You could then set the State programatically or on an event.

           

          Good Luck.

          • 2. Re: How Do I: CSS to work?
            Jerry62712 Level 1

            I added some stuff to the high contrast class ".headingText" and I don't see it ever being applied.

             

            I should have pointed out that the Text fields I'm trying to work with are in a component.  I don't know if that makes any difference and logic tells me it shouldn't, but just in case.  I know the default style class works as I made that text green and it appears that way when run.

            • 3. Re: How Do I: CSS to work?
              Jerry62712 Level 1

              It would seem that if you reset css by selecting a different one that this different one doesn't propagate to the components of an application.  To get around this problem, I added "setStyle"s to the function that adjusts the contrast.  This also allowed me to remove the background color.

               

              This was needed as the accessible part required high contrast.  So I set the background to white for the black text.  But when you go back to normal contrast, I had to remove the property completely so the underlying image would show again.