"Your @imports must come before all other content in your CSS. And I mean all of your content. Even putting comments before the @import tag will cause your imports to fail. So be sure to do your imports before you do anything else." - http://www.cssnewbie.com/css-import-rule/#.UtNj1PQmnn8
Direct from W3C:
"Any @import
rules must precede all other at-rules and style rules in a style sheet (besides @charset
, which must be the first thing in the style sheet if it exists), or else the @import
rule is invalid." - http://www.w3.org/TR/css3-cascade/#at-import
Here's a fiddle: http://jsfiddle.net/setek/5QsvU/
This demonstrates that when @import is not the first line of a stylesheet/embed, it does not work. Try putting the @import
first line, you can see what happens:
#sidebar a { color: #f00; }
@import url('http://jsfiddle.net/css/screen.css?jobofferinsidebar');
vs. just having:
@import url('http://jsfiddle.net/css/screen.css?jobofferinsidebar');