5 Replies Latest reply: Jul 19, 2012 9:18 AM by kglad RSS

    CSS tags

    John Delamotte Community Member

      I created a dymanic text field (already added to the stage) and made it html text. My problem is that I can't change some of the styles, such as p, span or b. I embeded the font  and need to create a h1 tag, which I was trying to do with classes. Could someone please help me and tell me what I'm doing wrong. Here is my code;

       

       

      myTF.htmlText = "";

       

      myTF.htmlText += "<span class='headings'>Treaty with the Blackfeet Sioux, 1865.</span>";

      myTF.htmlText += "<p>I have some text in here</p>";

      myTF.htmlText += "<p>I have some more text in here</p>";

      myTF.htmlText += "<p>I now have some text and a<a href='event:link'>link</a> to another frame in here</p>";

      myTF.htmlText += "<p>I now have some text and a<a href='http://www.google.com'>link</a> to a website in here</p>";

       

      myTF.addEventListener(TextEvent.LINK, myTFF);

       

      function myTFF(e:TextEvent):void

      {

          gotoAndStop(e.text);

      }

       

       

      var myCSS:StyleSheet = new StyleSheet();

      myCSS.setStyle("a:link", {color:'#0000CC',textDecoration:'none'}); <----Works

      myCSS.setStyle("a:hover", {textDecoration:'underline'});  <----Works

      myCSS.setStyle(".heading", {color:'#FFF'});    <-----Not working (with or without ".")

       

       

      myTF.styleSheet = myCSS;

        • 1. Re: CSS tags
          kglad MVP

          heading != headings.

           

          fix one of those.

           

          and assign the styles before using the styles:

           

           

           

           

          var myCSS:StyleSheet = new StyleSheet();

          myCSS.setStyle("a:link", {color:'#0000CC',textDecoration:'none'}); <----Works

          myCSS.setStyle("a:hover", {textDecoration:'underline'});  <----Works

          myCSS.setStyle(".heading", {color:'#FFF'});    <-----Not working (with or without ".")

           

          myTF.styleSheet = myCSS;

           

          myTF.htmlText = "";

           

          myTF.htmlText += "<span class='heading'>Treaty with the Blackfeet Sioux, 1865.</span>";

          myTF.htmlText += "<p>I have some text in here</p>";

          myTF.htmlText += "<p>I have some more text in here</p>";

          myTF.htmlText += "<p>I now have some text and a<a href='event:link'>link</a> to another frame in here</p>";

          myTF.htmlText += "<p>I now have some text and a<a href='http://www.google.com'>link</a> to a website in here</p>";

           

          myTF.addEventListener(TextEvent.LINK, myTFF);

           

          function myTFF(e:TextEvent):void

          {

              gotoAndStop(e.text);

          }

           


          • 2. Re: CSS tags
            John Delamotte Community Member

            I had no change. Maybe it's because I don't understand what you mean with this:

             

            heading != headings.

             

            Thank you for your help

            • 3. Re: CSS tags
              kglad MVP

              you have a typo in your code.  you used heading and headings.  those are not the same.

               

              copy and paste the code i suggested.  if you don't see any change in your heading span, change the color in the css to make it obvious it's working.

              • 4. Re: CSS tags
                John Delamotte Community Member

                Thank you it works

                • 5. Re: CSS tags
                  kglad MVP

                  you're welcome.