1 Reply Latest reply on Apr 27, 2009 12:45 PM by PeakDigital

    Fonts embedded in CSS aren't used in Design mode?

    PeakDigital Level 1

      I have spent several hours today trying to work out some issues with embedded fonts.  There are certain things I need to do in my app that evidently can only be done with embedded fonts, such as rotation and the Fade effect.

       

      The app uses an external CSS file, which contains these font commands:

       

      @font-face
          {
          src: url("../assets/Verdana.ttf");
          fontFamily: fontVerdana;
          advancedAntiAliasing: true;
          }

       

      @font-face
          {
          src: url("../assets/VerdanaBold.ttf");
          fontFamily: fontVerdana;
          fontWeight: bold;
          advancedAntiAliasing: true;
          }

       

      Application
      {
          fontFamily: fontVerdana;
      ... etc

       

      It appears to work when I compile my app into .swf and run it, but when I am in Design mode in the Flex Builder, it uses a different font.

       

      Does something else have to be done to get Flex Builder to reflect the embedded font while designing?  When I run the compiled app, some of my controls are pushed over, and I think it is because the font shown in the IDE is narrower than the embedded font.

       

      Any suggestions?

       

      Thanks.

      Paul

        • 1. Re: Fonts embedded in CSS aren't used in Design mode?
          PeakDigital Level 1

          I have still been fighting with this problem since my post.

           

          This morning, I decided to try altering my CSS to give >1 option for the fontFamily, like this:

           

          fontFamily: fontVerdana, Verdana;
          

           

          The font-embedding CSS remains the same as the original post.

           

          This solves one problem, and creates another. During design, Flex Builder does display things in Verdana font again. However, when I run the app, even though "fontVerdana" is the priority font in the assignment, it still uses the system version ("Verdana") instead of the embedded version ("fontVerdana"), so the functions that rely on the embedded font fail.

           

          Can anyone help me with this?  At this point the only thing I can think to do is use the altered fontFamily CSS during design, then edit my CSS file to reference only the embedded choice when I compile a release build.

           

          Thanks.

          Paul

           

          Message was edited by: PeakD - clarification