I'm updating my website design because it doesn't work properly in IE10.

I was using a bination of conditional ments and JavaScript to handle IE version detection, but since IE10 has dropped the former and I haven't found a reason for it ignoring the latter, I'm seeking help here. I've been reading this thread:

Detect IE version (prior to v9) in JavaScript

But my knowledge of JavaScript isn't far off zilch, so I'm not sure whether I should be looking to modify my code or scrap it and adopt and change the code mentioned in that URL (and if so, how I should do that).

The code I'm currently using:

<link rel="stylesheet" type="text/css" href="barebones.css">

  <!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="ie.css">
  <![endif]-->

  <!--[if gt IE 8]>
    <link rel="stylesheet" type="text/css" href="default.css">
  <![endif]-->

<script type="text/javascript">
    //<![CDATA[
    var appName = window.navigator.appName;
if (appName !== "Microsoft Internet Explorer")
document.write("<link rel=\"stylesheet\" type=\"text\/css\" href=\"default.css\" \/>");//]]>
</script>

If it helps I can post my site URL but I didn't want people to think I'm trying to get more site traffic or something.

I know that the code I'm currently using can be refined a bit but I would rather get things working before having a spring clean.

IE10 on more than one machine seems to ignore the JavaScript pletely and I don't know why. IE9 handles it fine.

Any assistance would be much appreciated.

I'm updating my website design because it doesn't work properly in IE10.

I was using a bination of conditional ments and JavaScript to handle IE version detection, but since IE10 has dropped the former and I haven't found a reason for it ignoring the latter, I'm seeking help here. I've been reading this thread:

Detect IE version (prior to v9) in JavaScript

But my knowledge of JavaScript isn't far off zilch, so I'm not sure whether I should be looking to modify my code or scrap it and adopt and change the code mentioned in that URL (and if so, how I should do that).

The code I'm currently using:

<link rel="stylesheet" type="text/css" href="barebones.css">

  <!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="ie.css">
  <![endif]-->

  <!--[if gt IE 8]>
    <link rel="stylesheet" type="text/css" href="default.css">
  <![endif]-->

<script type="text/javascript">
    //<![CDATA[
    var appName = window.navigator.appName;
if (appName !== "Microsoft Internet Explorer")
document.write("<link rel=\"stylesheet\" type=\"text\/css\" href=\"default.css\" \/>");//]]>
</script>

If it helps I can post my site URL but I didn't want people to think I'm trying to get more site traffic or something.

I know that the code I'm currently using can be refined a bit but I would rather get things working before having a spring clean.

IE10 on more than one machine seems to ignore the JavaScript pletely and I don't know why. IE9 handles it fine.

Any assistance would be much appreciated.

• javascript
• internet-explorer-10

• 8 Instead of detecting the browser, find the actual issues and write cross-browser code. IE10 is standard enough to ply with standards unlike IE6-7. – Fabrício Matté Commented Mar 24, 2013 at 19:32
• I'm serving IE 9 and 10 the same stylesheet as other browsers. – mikeymike Commented Mar 24, 2013 at 19:37
• 1 keep your ments for the browser that need (and can use them), and let IE10 use the mon code and styles. – kennebec Commented Mar 24, 2013 at 20:43
• It's also important to note that IE 10 does not support conditional ments (in the default "Standards Mode"). See this MSDN article, which is basically saying what @jcreamer989 says below (to use feature detection). – ak2600 Commented Jul 22, 2013 at 2:22

4 Answers 4

It's best when dealing with these kind of issues to avoid "broswer detection" and go with a "feature detection"

A library like http://modernizr./ will help you test for specific features that browser's are patible with rather than hacking around different versions of browsers.

That being said, IE10 tends to be a standards pliant browser. You can visit http://caniuse./ and find charts of the various JavaScript and CSS features and which one's are supported in all the different browsers.

You'll find that IE10 adheres to a great deal of these standards.

Although I like a number of the answers above, I know that sometimes having an array of possible quick fixes to given a problem can sometimes make all the difference. Thus, here's another solution I've found that works well:

<script language="javascript" type="text/javascript">
    if(Function('/*@cc_on return 10===document.documentMode@*/')()) document.documentElement.className+= ' ie10';
</script>

Then to implement the browser-specific css rules, in an appropriate css file I add (for example):

.ie10 div{new css rule}
.ie10 div{another new css rule}

Recently I've adopted css browser selector as a solution. It is a js that appends specific css class to the document root so you can handle style discrepancies in browsers inside your css without hacks. It is pretty old though and does not support IE10, but as others are saying, IE10 is pretty standard. It handles IE6, 7, and 8 though (and you seem to take special measures for these browsers) so I am guessing it will work for you.

In general, you should avoid browser specific hacks or checks like these, since they are hard to maintain and not guaranteed to always work.

Since IE10 doesn't recognize conditional ments and what you need is to detect the browser version, I've implemented a function to do this:

    function getIEVersion() {
        if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { 
        /*
         * sample user-Agent
         * "Mozilla/5.0 (patible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)" 
         */
         //test for MSIE x.x;
         var ieversion = new Number(RegExp.$1); // capture x.x portion and store as a number
         return ieversion;
        }
    return -1;
    }

    alert(getIEVersion());

it returns the number of the IE version. (ex: 10, 9, 7..)