s:Label does not load the font

I have a mxml component with a "s:Label" and

fontFamily="notes"

as an attribute.

Source code:

<?xml version="1.0" encoding="utf-8"?>
<s:SkinnableContainer xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx开发者_StackOverflow"
                  mouseUp="skinnablecontainer1_mouseUpHandler(event)" mouseDown="skinnablecontainer1_mouseDownHandler(event)"
                  skinClass="skin.SkinBackgroundImageUserStory" width="240" height="120">

<fx:Style source="/styles/styles.css"/>

<fx:Script>
    ...
</fx:Script>

<s:Label x="5" y="5" width="200" height="100" text="{myText}" fontFamily="notes" fontSize="30"/>
</s:SkinnableContainer>

And I have the styles.css:

@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";

@font-face {
    src: url("/styles/fonts/rabiohead.ttf");
    fontFamily: "notes";
}

So I thought, that would be okay and the text of my s:Label will be formatted with this special font. But the output is the normal font. By changing the "s:Label" to a "mx:Label", the font is "loaded". So, what can I do that the font will work with s:Label?

Best Regards PHANTOMIAS

@font-face {
    src: url("/styles/fonts/rabiohead.ttf");
    fontFamily: notes;
}

little late, but hey it's an answer :)

You need to add the 'embedAsCFF' property when embeddeding fonts for spark components (eg. s:Label)

@font-face {
    src: url("/styles/fonts/rabiohead.ttf");
    fontFamily: "notes";
    embedAsCFF: true;
}