Flex 4 - CSS type selectors are not supported

Question

I am trying to create popup window in flex 4 using TitleWindow with skinning. And the TitleWindow contain some form items. But it displays a warning message like this "CSS type selectors are not supported in components: 'spark.components.FormItem' "

My sample code

<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx"
           width="400" height="600"
           title="Add Employee Details"
           close="addEmployeeTitleWindowClose(event)">

<fx:Style>
    @namespace s "library://ns.adobe.com/flex/spark";
    @namespace mx "library://ns.adobe.com/flex/mx";
    s|FormItem
    {
        skinClass:ClassReference("skins.CustomFormItemSkins");
    }
</fx:Style>

And I tried this too..

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

My css is

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

s|FormItem
{
skinClass:ClassReference("skins.CustomFormItemSkins");
}

Anybody can find out my mistake?

Answer 1

Your sample code is not in your main application.

<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
s|FormItem
{
    skinClass:ClassReference("skins.CustomFormItemSkins");
}

you have to add this style on your main application. That is where you have the Application container.

I think it should be right....