How do I make an "else" in an IE HTML conditional?
JavascriptHtmlCssInternet Explorer-9Javascript Problem Overview
<!--[if lt IE 9]>
This is less then IE9
ELSE
this is all browsers: firefox, chrome, etc.
<![endif]-->
How do I do this in my HTML? I want to do an "else" ...
Javascript Solutions
Solution 1 - Javascript
You're not looking for an else, you're looking for <![if !IE]> <something or other> <!--[endif]>
(note that this is not a comment).
<!--[if IE]>
You're using IE!
<![endif]-->
<![if !IE]>
You're using something else!
<![endif]>
You can find documentation on the conditional comments here.
Solution 2 - Javascript
I use the following to load resources in IE9 or newer and all other browsers
<!--[if gte IE 9]><!-->
//your style or script
<!--<![endif]-->
This is hard to believe. Look the opening and closing if statement sections are inside comments (so, its not visible to other browsers) but visible to IE.
Solution 3 - Javascript
The solution for your problem is (note the use of <!-- -->
):
<!--[if lt IE 9]>
This is less then IE9
<![endif]-->
<!--[if gt IE 8]> <!-- -->
this is all browsers: IE9 or higher, firefox, chrome, etc.
<!-- <![endif]-->
Solution 4 - Javascript
conditional comments can be in scripts as well as in html-
/*@cc_on
@if(@_jscript_version> 5.5){
navigator.IEmod= document.documentMode? document.documentMode:
window.XMLHttpRequest? 7: 6;
}
@else{
alert('your '+navigator.appName+' is older than dirt.');
}
@end
@*/
Solution 5 - Javascript
You do not need to do an else
. It is implied. So
// put your other stylesheets here
<!--[if lt IE 9]>
//put your stylesheet here for less than ie9
<![endif]-->
Solution 6 - Javascript
The accepted answer by @cwallenpoole breaks the markup, makes HTML invalid, and breaks Visual Studio's syntax highlight.
Here's how you keep it clean:
<!--[if IE]>
You're using IE!
<![endif]-->
<!--[if !IE]><!-->
You're not using IE. See, even SO highlights this correctly.
<!--<![endif]-->
Solution 7 - Javascript
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="en-US" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">
</head>
<!--[if IE]>
<body style="margin: 38px 0 0 0;">
<![endif]-->
<!--[if !IE]>
<body>
<![endif]-->
-Content-
</body>
</html>
This worked for me, after hours of searching. I needed the head room for a pop-up banner, that IE didn't want to animate. it was supposed to hide itself after a few seconds. Using this, I was able to just move the entire page down just enough, but only in IE, which was exactly what i needed!
Currently only for those who still use IE, I prefer FireFox or Chrome myself.
Thank you for these letters/symbols in this specific order!