Last modified: 2013-04-05 21:47:10 UTC
I am using a @import statement in my skin.css to load css from another side. There is no way to do this with js, because sometimes I am using a browser without js. It looks like that css is not loaded anymore since the resource loader is used. The problem is that the skin.css is wrapped in a @media {}. But the @import should be outside the @media{}. It is possible to put a @import statement outside the @media, so it works? Thanks.
I've always been puzzled as to why we even do @media all { } anyway. Can't we use @media just for the "special" media ('print' and 'screen') and use top-level CSS for 'all'? Of course that'd just move the problem to @import not working or not working properly for media-specific CSS, but I think that's less of a problem.
You can import css with @import for specific media, so that is no problem (http://www.w3.org/TR/CSS21/cascade.html#at-import) I have also seen some user using @media in his user.css. I do not know if there also break (@media inside @media) after updating to RessourceLoader.
I sense that our cleverness is getting us in trouble..
Before ResourceLoader imported media, user stylesheets and site styles were loaded with the media="all" attribute. I'd say keep that the way it was. No complains about that in the past right ? That way everthing stays compatible. And everybody can keep using special styles for print only or for screen only in their User:Me/skin.css Also, things like MediaWiki:Print.css can then simply be wrapped in @media print (not in a seperate <link>), when it's defined as module. (as can extensions when defining the style modules)
(In reply to comment #4) > Before ResourceLoader imported media, user stylesheets and site styles were > loaded with the media="all" attribute. I'd say keep that the way it was. No > complains about that in the past right ? > > That way everthing stays compatible. And everybody can keep using special > styles for print only or for screen only in their User:Me/skin.css > I have suppressed the output of @media all { } blocks (they're useless anyway) in r79839. > Also, things like MediaWiki:Print.css can then simply be wrapped in @media > print (not in a seperate <link>), when it's defined as module. (as can > extensions when defining the style modules) This has been done some time ago, see ResourceLoaderSiteModule.php
This is the best solution I think - good work - as long as people don't register their styles as a specific media type (something they certainly would need to go out of their way to do) they can do all the strange trickery they want, including using the @media block themselves. We need to document the caveat of using the media type registration somewhere though.
(In reply to comment #6) > This is the best solution I think - good work - as long as people don't > register their styles as a specific media type (something they certainly would > need to go out of their way to do) they can do all the strange trickery they > want, including using the @media block themselves. We need to document the > caveat of using the media type registration somewhere though. Once you're doing media type registration, why would you want to use @import?
Beats me - that's why this seems to be the best way to go. It works as you would imagine by default.
