Internet Explorer 10 to No Longer Support Conditional Comments

We use conditional comments to target specific versions of Microsoft’s Internet Explorer browser (MSIE), mainly through our ie_conditional_tag. This returns a block of markup that applies various class names to the tag, like this:

    <!DOCTYPE html>
    <!--[if lt IE 7]><html class="ie ie6 some-custom-class"><![endif]-->
    <!--[if IE 7]><html class="ie ie7 some-custom-class"><![endif]-->
    <!--[if IE 8]><html class="ie ie8 some-custom-class"><![endif]-->
    <!--[if IE 9]><html class="ie ie9 some-custom-class"><![endif]-->
    <!--[if gt IE 9]><html class="ie some-custom-class"><![endif]-->
    <!--[if !IE]><!--><html class="some-custom-class"><!--<![endif]-->
      <head>
        <title>New HTML5 page</title>
      </head>
      <body>
        <!-- your content -->
      </body>
    </html>

This lets us target older versions of MSIE specifically to improve our experience across browsers. Microsoft’s development team intends to remove "the less-successful legacy features" in Internet Explorer 10, and one of those is conditional comments.

The main reason for conditional comments and targeted styles has been the slow pace at which enterprise IT departments upgrade their systems. There are just a lot of users on older browsers, and by ignoring them, we are ignoring customers. That may be considered a good thing for certain markets, but not everyone has that luxury

Many enterprise companies recently upgraded to IE7, which was initially released in 2006. This is due to large amounts of legacy enterprise software ("legacy" and "enterprise" being two words which keep us up at night) that rely on browser specific code, mainly in versions of JavaScript or other proprietary scripting. That code must be rewritten to an open standard (ideally) before it is usable in newer browsers.

Playing Nice While Looking Forward

It’s almost impossible to have a stylesheet targeted at new browsers work flawlessly in old ones. We can use Modernizr to provide HTML5 elements and access to other polyfills.

Internet Explorer 9 is already a very robust browser and has support for many of the cutting edge elements in HTML and CSS that we’ve started to explore. Microsoft has also announced that it will begin doing automatic updates on browsers in Windows XP, Vista, and 7

This doesn’t mean that our conditional tag won’t continue to do what it’s always done. Older browsers will self-register and add the class to the tag. And by writing valid markup, we can avoid a lot of the issues between browsers. For those of us who still have to make MSIE6 and it’s younger cousins work, there’s a lot of documentation out there to get us there.

If we need to target in the future, we can use a browser detection javascript and then use a conditional array to add classes on document.ready to our page. While it requires javascript, the default rails applications do as well for the destroy method, so this shouldn’t be a major problem for most of us.

Have fun in the trenches!

  • http://twitter.com/stowball Matt Stow

    I’ve written a small, vanilla JavaScript plugin called Layout Engine, which allows you to feature detect IE 10 (and every other browser), in a simple way that cannot be faked, unlike user agent sniffing.

    It adds the rendering engine name as a class on the html tag and returns a JavaScript object containing the vendor and version (where appropriate)

    Check out my blog post: http://mattstow.com/layout-engine.html and get the code on GitHub: https://github.com/stowball/Layout-Engine

    • http://athames.com/ Crates

      Thanks, Matt… we’ll definitely check that one out.

  • bobMarley

    The mind boggles! We need conditional statements to work around plethora of mistakes the MS team make time and time again. Now they’ve taken it out!?!! They really need to stop writing browsers – they all suck seriously massive cheesy horrible etc.

  • http://athames.com/ Crates

    I’m still trying to figure out how they expect us to do this:

    < ! –[if IE] > < ! [endif]– > < ! –[if !IE] >< ! — > < ! –< ![endif]– >

    (spacing added to allow the comment to post)

    In this instance, we want to run jQuery v2 for modern browsers, and run jQuery 1.10 for Internet Explorer, because Internet Explorer is a spoiled little brat that always needs special attention. Thanks to Microsoft’s brilliant decision to only ever poorly support web standards, always come to the party late, not invest enough money in developing their browser, and now (on top of everything else) not allow us to easily polyfill solutions for IE, they have basically said, “We don’t want you to code solutions for IE. We want you to STOP CODING FOR IT, PERIOD.”

    So, there’s the answer. Stop using Microsoft products. They don’t want you as a customer, they don’t want your business, and they probably don’t even want to BE in business anymore. They are sick of being alive. Let’s give them the Kevorkian treatment they so badly yearn for.