Rendering a simple HTML page on IE 11 is proving to be a challenge as it's not picking up the IE-specific CSS file.
Below is the code being used:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="images/favicon.ico">
<title>Demo</title>
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="css/all-ie-only.css" />
<![endif]-->
</head>
<body class="subpage">
</body>
</html>
The CSS files are as follows:
style.css
body{background:blue;}
all-ie-only.css
body{background:red;}
Note : Previous attempts and references from similar questions have been made with no success.
Click here for more details.
Attempted Solution:
<script>
/*@cc_on
@if (@_jscript_version == 11)
document.write("You are using IE11 with an older document mode");
@elif (@_jscript_version == 10)
document.write("You are using IE10");
@elif (@_jscript_version == 9)
document.write("You are using IE9");
@elif (@_jscript_version == 5.8)
document.write("You are using IE8");
@elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
document.write("You are using IE7");
@elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
document.write("You are using IE6");
@elif (@_jscript_version == 5.5)
document.write("You are using IE5.5");
@elif (@_jscript_version < 5.5)
document.write("You are using a version older than IE5.5");
@else
document.write("You are using an unknown version of IE");
@end
@*/
</script>
For more on conditional comments, visit this link.
If you have any insights or further suggestions, they would be greatly appreciated.