Conditional comments for Internet Explorer AND non-IE browsers

7th April 2006

The following statement will tell you if you are using Internet Explorer or not and if so which version.
Not unusual you may say, until you look closer and realise that Microsoft Conditional Comments are recognising non-IE browsers!

You are NOT using Internet Explorer

You can also target different versions of Internet Explorer AND non Internet Explorer.

If you are using either IE6 or a non IE browser then you will see the following text.
If you are using IE5.x or IE7 then you will not see any text.

You are using EITHER Internet Explorer version 6
OR a non-IE browser

And finally you can target specific IE browser AND non-IE browsers but feed a mixture of information to both.
The following will feed extra text to IE6 which will not be seen by non-IE browsers.

You are using a non-IE browser

IE6 will see 'You are using IE6 and not a non IE browser' and non-IE browsers will see 'You are using a non IE browser'. IE5.x and IE7 will see 'You are using'.

I don't know what use this last one will be but there may be an occasion when it will come in handy.




Information

The above text is generated using just conditional comments. There is no CSS, javascript, PHP or any other programming language involved.

This is just a demonstration of how Internet Explorer's conditional comments can be used to identify non-IE browsers and serve them with markup that will be hidden from Internet Explorer.

I have used this method in my most recent version of the CSS only dropdown menu.

The xhtml

The xhtml code for the normal conditional comments is straightforward as set out by Microsoft.

<!--[if IE]>
<h1>You are using Internet Explorer</h1>
<![endif]-->
<!--[if IE 5]>
<h1>Version 5</h1>
<![endif]-->
<!--[if IE 5.0]>
<h1>Version 5.0</h1>
<![endif]-->
<!--[if IE 5.5]>
<h1>Version 5.5</h1>
<![endif]-->
<!--[if IE 6]>
<h1>Version 6</h1>
<![endif]-->
<!--[if IE 7]>
<h1>Version 7</h1>
<![endif]-->

I have found that the following code will allow you to target non-IE browsers

<!--[if !IE]><!-->
<h1>You are NOT using Internet Explorer</h1>
<!--<![endif]-->

..and finally to target non-IE and a specific IE browser
(or any combinations using lte lt or gt gte).

<!--[if IE 6]><!-->
<h1>You are using EITHER Internet Explorer version 6<br />
OR a non-IE browser</h1>
<!--<![endif]-->
<h1>You are using
<!--[if IE 6]>IE6 and not <!-->
a non-IE browser
<!--<![endif]--></h1>

Copyright

You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.

Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.

If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.


Please ask permission before using or copying this example to your web site.


Please Support CSS play

Please note that if your donation is for a demo/menu then you will need to email me with the url of the demo/menu after making the donation

For more CSS demonstrations I recommend that you visit the Dynamic Drive CSS Library.


Free, practical CSS menus, layouts, and examples

Soft Geometry Creative Industries

Soft Geometry Creative Industries
is a music-based design company located in Bristol UK.
I create artwork for albums, singles, posters and t-shirts.
My work is influenced by punk and post-punk poster and flyer design,
lo-fi photocopy aesthetics,
Francis Bacon and Mark Rothko.

I can provide a start to finish service with my own art and photography, put together work from images provided by yourself, and collaborate on an idea.
softgeometrycreative{at}gmail.com

Follow CSS play


Facebook   Twitter   Facebook Fan Page