I'm having trouble getting
<!--[if !IE]>
to work. I'm wondering if it is because I have this in my document
<!doctype html>
<!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
<!--[if IE 7]> <html class="ie7 oldie"> <![endif]-->
<!--[if IE 8]> <html class="ie8 oldie"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="">
<!--<![endif]-->
When I add
<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css" />
<!--<![endif]-->
to my header for some reason it doesn't work. However if I add
<!--[if !IE]><!-->
<style>
All my css in here
</style>
<!--<![endif]-->
to the actual html page (in the header) it works. Any suggestions? Cheers
Update to my question
Ok, when I removed
<!-->
I only checked in IE which was working but now back in FF the no-ie.css had been applied to FF too. So I added back in the <!-->
and removed the / (and added that into the main template so the cms wouldn't add it back in) and all is working back in FF but now the stylesheet is being applied to IE!
So I tried
<!--[if IE]>
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css">
<![endif]-->
and
<!--[if !IE]> -->
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css">
<!-- <![endif]-->
And that didn't work. Basically I'm trying to get this page to work http://css-tricks.com/examples/ResponsiveTables/responsive.php but move the css into a stylesheet. Surely it's got to be simple. What am I missing? I'd rather not use JQuery if I don't have to. Cheers
An update if somebody still reaches this page, wondering why the ie targeting doesnt work. IE 10 and onward no longer support conditional comments. From the MS official website:
Please see here for more details: http://msdn.microsoft.com/en-us/library/ie/hh801214(v=vs.85).aspx
If you desperately need to target ie, you can use this jquery code to add a ie class to and then use .ie class in your css to target ie browsers.
Update: $.browser is not available after jQuery 1.9. If you upgrade to jQuery above 1.9 or you already use it, you can include jQuery migration script after jQuery so that it adds missing parts: jQuery Migrate Plugin
Alternatively, please check this thread for possible workarounds: browser.msie error after update to jQuery 1.9.1
In case you are working with IE 10 or above, as mentioned in http://tanalin.com/en/articles/ie-version-js/ the conditional comments are no longer supported. You might refer to https://gist.github.com/jasongaylord/5733469 as an alternative method, which the Trident version is checked as well from the navigator.userAgent. This also verified in case the browser is working in compatibility mode.
I use that and it works :
You need to put a space for the
<!-- [if !IE] -->
My full css block goes as follows, since IE8 is terrible with media queriesFor IE browser:
For all non-IE browsers:
For all IE greater than 8 OR all non-IE browsers :
This works for me across all browsers greater than version 6 (IE7, 8, 9, 10, etc, Chrome 3 up to what it is now, and FF ver 3 up to what it is now):