Search code examples
javascriptcssinternet-explorerconditional-comments

How to link a conditional style sheet without access to the head


I am working in an enterprise CMS (Autonomy/Interwoven Teamsite) that does not give me direct access to the head of a page. I can only link style sheets and add external js files. Normally I would add a conditional comment to link an ie6/ie7 stylesheet. In some searching I've found a way to target ie with conditional commenting inside js and specific ie versions based on the jscript version

in js:

/*@cc_on
    document.createStyleSheet("/css/all_ie_fixes.css");
    /*@if (@_jscript_version = 5.6)
        document.createStyleSheet("/css/ie_6.css");
    /*@end
@*/

This seems like an ugly hack. Any suggestions?


Solution

  • There's probably no non-ugly way to do this. That said, using the user-agent detection provided by a library like YUI (relevant YUI doc) will arguably result in slightly clearer and more explicit code than the above hack. Something like:

    if (YAHOO.env.ua.ie >= 6 && YAHOO.env.ua.ie < 7)
    {
            document.createStyleSheet("/css/ie_6.css");
    }
    

    Ugly, yes. But it's pretty clear what the intent is.