Migrating CSS from Flex 3 to Flex 4


Having searched around for how to make CSS work when migrating to Flex 4 from Flex 3 and finding lots of incorrect namespace declarations I thought I'd blog this as a reminder to myself:

If you have a current Flex3 project and you are migrating to Flex4 you need to add the following lines at the top of your stylesheet.

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

This makes the default non-namespaced items in your stylesheet refer to the MX components. eg:

Button{fontSize:18;}

And to style up spark buttons you simply use:

s|Button{fontSize:18;}

Note there were lots of ones that I found that were wrong.

Do NOT use:


@namespace "library://ns.adobe.com/flex/halo";
OR
@namespace "http://ns.adobe.com/mxml/2009";

This info was sourced from the Flex SDK Wiki.


This post was posted in , , , by on