Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IE Conditional Comments and Chrome/Firefox

I am using the following IE conditional comment:

<!--[if gt IE 7]>
Here is some code.
<![endif]-->

This works great to keep the code from rendering in any IE lower than 8.
However, this also keeps the code from rendering in Chrome and Firefox.

Any ideas on why this is happening, and how I can get the code to render in browsers other than IE?

like image 977
Baxter Avatar asked Apr 15 '12 04:04

Baxter


People also ask

Which is the only browser that supports conditional comments?

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.

What is html5 conditional comments?

Conditional comments are conditional statements to hide or provide HTML source code from Internet Explorer. 2. There are two types of conditional comments - downlevel-hidden - which is used to hide HTML source and downlevel-revealed which is used to reveal HTML source code in Internet Explorer.

How do you use conditional comments in HTML?

Conditional comments use a special syntax—HTML markup wrapped in a conditional statement—and are placed within an HTML comment. If the statement evaluates to true , the enclosed HTML is revealed within the HTML document. If the statement evaluates to false, the enclosed HTML remains hidden.


1 Answers

Conditional comments are a Microsoft IE-specific rule, and they are not part of any standard. If you check the structure of a conditional comment:

<!--[if gt IE 7]>
Here is some code.
<![endif]-->

As its name would imply, it is all just a big comment <!-- comment -->. IE checks comments for conditions such as these which, again, do not comply with HTML standards.

To create code which doesn't render in IE, but does render in other browsers, you use the following conditional:

<!--[if !IE]> -->
This will be rendered by anything but IE.
<!-- <![endif]-->

See how the conditions are enclosed in closed comments? That's why that is rendered in normal browsers, while IE checks for the conditional, and decides to omit everything up until the endif.

EDIT

If you want to add another condition, and keep rendering the code on non-IE browsers, you could use the following workaround:

<!--[if gt IE 7]> <!-- -->
Here is some code for anything but IE 7 and below.
<!-- <![endif]-->

Note I had to use open the comment again to prevent IE from rendering --> before the code. Other browsers will still consider it part of the comment.

like image 160
zebasz Avatar answered Nov 14 '22 16:11

zebasz