DevKick Forums - Browser-specific @imports2008-05-15T12:58:32ZFluxBBhttp://devkick.com/talk/topic/10/browserspecific-imports/Re: Browser-specific @importsHi David,
that was something I didn't get on your replies at the blog post: why IE5/OSX hacks couldn't go directly on the IE style sheet? As I understand you're saying they need to be on their own standalone style sheet, why?
I prefer the CC way too.
Also, although the idea of linking just one stylesheet is appealing, I think it's more a matter of user preference. In fact, you have already done it on tripoli.css and tripoli-ie.css, or am I wrong?
Finally, regarding the order of linking the stylesheets, this is the one I currently prefer:
[code]
<!-- Tripoli - a CSS standard for HTML rendering -->
<link rel="stylesheet" href="/css/tripoli.base.css" type="text/css" media="all" />
<link rel="stylesheet" href="/css/tripoli.visual.css" type="text/css" media="all" />
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="/css/tripoli.base.ie.css" media="all">
<![endif]-->
<!-- / + info: http://devkick.com/lab/tripoli/ -->
<!-- my own set of style sheets, so I can easily override any Tripoli default, even IE specific rules -->
<link rel="stylesheet" href="/css/mycss1.css" type="text/css" media="all" />
<link rel="stylesheet" href="/css/mycss2.css" type="text/css" media="all" />
<!-- Tripoli - (print CSS) -->
<link rel="stylesheet" href="/css/print.css" type="text/css" media="print" />
<!-- / + info: http://devkick.com/lab/tripoli/ -->
<!-- finally, my own IE-specific style sheet, it lets me override (for IE6/7, of course) any rule on any stylesheet above, doesn't matter which one (tripoli, my own set, print, etc) -->
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="/css/ie-custom.css" media="all">
<![endif]-->
[/code]
What do you think?maniqui2008-05-15T12:58:32Zhttp://devkick.com/talk/post/27/#p27Browser-specific @importsOne idea I have been considering is if it's cleaner to have different import statements for different browsers from one master stylesheet. As of now, I use a minimal amount of browser-specific "hacks" in the base stylesheet. But there are ways to import stylesheets instead of using inline hacks, like ex:
[code]@import: url("ie.css");[/code]
(note the colon) Only IE will import this stylesheet. We could do the same for opera and IE5/mac, but since these rules are minimal, I'm just not very comfortable having too many server requests for such little code.
In general, I like the conditional comments way of targeting IE, because I know it always works and it's future-proof; no-one really knows how future versions of IE will treat weird CSS hacks that have worked before.
On the other hand - I kind of like the idea of having only one stylesheet in the HTML source and then import the needed fixes for each browser.
Any thoughts?David2008-05-13T12:34:23Zhttp://devkick.com/talk/post/18/#p18