CSS Warnings
Posted: 2009-06-19 00:00:00

Have you ever run across this warning in Flex - "CSS type selectors are not supported in components"? I was working on a project recently where I had about 6 of those warnings. Though the application built and ran fine, I found a solution.

What was causing the errors is that I was trying to set CSS declarations for Application, ToolTip, and Alert, mainly because on each of those, there was special classes and styles that were being called to appropriately skin each component. To do that, I was declaring (for example) the ToolTip component in a CSS file such as: ToolTip { backgroundColor: #000000; } The above would work fine when the application was built, but, of course, that nice little type selector error would appear. The work around is to fix your styles at the creationComplete event of your application.

First, change the offending styles in the CSS file so that they are style names by prefixing them with a dot ".", so "ToolTip" becomes ".ToolTip". Then, put a listener on the creationComplete event of your main application and tie it to a function (for example, name your function "initApplication()"). Finally, inside your new function, do the following: StyleManager.getStyleDeclaration("ToolTip").setStyle("backgroundColor", StyleManager.getStyleDeclaration(".ToolTip").getStyle("backgroundColor")); What you are doing, essentially, is applying the style at runtime, but tying it directly to a style that you have programmed, instead of hardcoding a value. Plus, since you put the styles into a style sheet (you are using style sheets for all of your common styles I hope!), they are easier to change later for anyone else taking over the project or a designer coming in to make adjustments. I hope that helps some out there!

Back to the main page