CSS contains @import
This means that the URL in question is a CSS file that contains at least one @import rule.
Why is this important?
The CSS @import function makes it possible to include external CSS files in a document. It can be used as a way to import CSS scripts within a stylesheet tag in HTML documents or to add extra rules within CSS files.
This function has a negative effect on performance, as they introduce additional roundtrips into the critical path: the imported CSS resources are discovered only after the CSS stylesheet with the @import rule itself is received and parsed, so the browser will not continue downloading any other style sheets until this @import file has finished.
What does the Hint check?
This Hint will trigger for any internal or external CSS URL which contains the @import function.
Examples that trigger this Hint:
The Hint would trigger for any style sheet that contains:
How do you resolve this issue?
What you first should do is remove all the @import rules from your CSS code. Then you open all the CSS files you use for the web page (also the ones you don’t use @import for), copy & paste all the codes within those files, combine them all in one large CSS script and call it from a HTML header within style tags.