Menu
This has got to be really boneheaded.. but after reading the same very simple answer over and over on various blogs and on the microsoft site, that AFAICT I AM doing it right, I am still stumped, so I ask here:
Why does the IE conditional in this test page render the literal <![endif]--> at the bottom of the page in IE, when viewed on a local network ? I am pretty sure that is the correct syntax for an IE 'Downlevel-hidden conditional comment'.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>IEconditionalSyntax_wtf.html</title>
</head>
<body>
well?<br>
<!--[if IE]>
wtf?!
<![endif]-->
</body>
</html>
Update:
to save your time reading all the comments... if you are having the same issue: Most of the comments below basically just propose possible (but inconclusive, ineffective) explanations, and a couple guys report that they were unable to reproduce the issue. So far it seems no one knows the answer. I only see the issue when viewing the page on IE9/Win7 (w/any browser/document mode)... on my local server (page served by my local iMac 10.6.8, w/built in webserver).
But just because no one was able to rid my local server of this issue does not necessarily mean that the below suggestions will not answer the issue for you. Until we know the answer(s) I suppose it is not helpful to assume anything. So you probably do want to try everything listed below, if you also have <![endif]--> appearing on your page in IE, for seemingly no good reason.
Patrick gives a great workaround, but it does rely on jquery.
I debated whether to award the bounty (that I started, and which expired on 16 April 2012), or accept an answer, so that where acknowledgement was due it was awarded... and there was no clear action for me.. so I just decided to let the system auto-award half the bounty to Patrick for the great (albeit jquery) workaround. I did not want to give the whole bounty because the whole point of the bounty was to satisfy my curiosity as to why I am seeing the conditional comment in the first place. I also did not want to accept any answer (so far) because in this case I am not going to use any workaround since the issue only appears on my local network and so is irrelevant for the production code live to the world.
778
Conditional comments are a simple Internet-Explorer-only feature that Microsoft added to IE5 Windows and later. (Mac IE doesn't support them.) They provide an easy way to detect that the visitor is using an IE browser (and which version they're using). You can then serve IE users different blocks of HTML as required.
Conditional comments are conditional statements interpreted by Microsoft Internet Explorer versions 5 through 9 in HTML source code. They can be used to provide and hide code to and from these versions of Internet Explorer. Conditional comments are not supported in Internet Explorer 10 and 11.
This method allows you to use simple code in your HTML to detect Internet Explorer (IE). You can determine whether or not the end user is using IE, and if so, which version. This allows you to provide content based on which browser is being used.
IE10 won't support conditional comments, so I suggest using a different method altogether.
Javascript works well for this.
Here is what I do that is A LOT easier to use, requires jquery
var userAgent, version;
if ($.browser.msie) {
version = "ie" + $.browser.version.substring(0, 1);
$("body").addClass("ie " + version);
} else if ($.browser.mozilla) {
$("body").addClass("mozilla");
if (navigator.userAgent.toLowerCase().indexOf('firefox') !== -1) {
userAgent = navigator.userAgent.toLowerCase();
userAgent = userAgent.substring(userAgent.indexOf('firefox/') + 8);
userAgent = userAgent.substring(userAgent.indexOf('firefox/'), userAgent.indexOf('.'));
version = "ff" + userAgent;
$("body").addClass(version);
}
} else if ($.browser.opera) {
$("body").addClass("opera");
} else if ($.browser.webkit) {
$("body").addClass("webkit");
}
Then you can write css like this:
span.something { width: 30px; }
.ie7 span.something {width: 25px;}
And, even better, use this in conjunction with modernizr and you can write rules based on feature support as well.. Note that those are global js variables, so you can even use those for different functionality based on browser. Like, if you need to write an ie7 hack or something.
EDIT: replaced code with less verbose version, same result
121
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
