I am using this code to generate an IE version specific class for the html tag. This allows me to create css for only these IE versions and the css validates. This is based on Paul Irish's work on http://html5boilerplate.com/

<?php if(preg_match('/MSIE/i',$_SERVER['HTTP_USER_AGENT'])) : ?>
  <?php $user_agent = 'IE'; ?>   
  <!--[if lt IE 7]> <html class="ie6" lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>"<?php print $rdf->version . $rdf->namespaces; ?>> <![endif]-->
  <!--[if IE 7]>    <html class="ie7" lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>"<?php print $rdf->version . $rdf->namespaces; ?>> <![endif]-->
  <!--[if IE 8]>    <html class="ie8" lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>"<?php print $rdf->version . $rdf->namespaces; ?>> <![endif]-->
<?php endif; ?>

<?php if ($user_agent == 'IE') { print '<!--[if gt IE 8]><!-->'; } ?>
  
<html lang="<?php print $language->language; ?>" dir="<?php print $language->dir; ?>"<?php print $rdf->version . $rdf->namespaces; ?>>

<?php if ($user_agent == 'IE') { print '<!--<![endif]-->'; } ?>
CommentFileSizeAuthor
#3 omega-ie-specific-html-class-1358664.patch2.08 KBjwilson3

Comments

finex’s picture

finex commented

Why not add the class on the body using hook_preprocess_html() ?

jwilson3’s picture

jwilson3
Primary language English
Location Ecuador
commented

Why not add the class on the body using hook_preprocess_html() ?

Because body classes are often used as valid directives and older versions of ie do not support chaining... The following example wouldn't work in IE6, the background would still be shown red.

body.node-type-page #content {
  background: red;
}
body.ie6.node-type-page #content {
  background: green;
}

It is an unwritten rule of thumb to place "user agent compatibility support" classes on the html tag. For example, core uses html.js to flag browsers that have javascript support.

jwilson3’s picture

jwilson3
Primary language English
Location Ecuador
commented
StatusFileSize
new omega-ie-specific-html-class-1358664.patch2.08 KB

Now, for a proper review...

The proposal in the OP uses server-side browser sniffing to decide when to print the extra conditional elements. This causes problems when your site sits behind a reverse proxy cache like varnish. If you need this in your theme, I would just override html.tpl.php (eg the one from alpha) to include the following code (I've stripped out the xml namespaces for clarity:

<!--[if lt IE 7 ]> <html class="ie ie6"><![endif]-->
<!--[if IE 7 ]>    <html class="ie ie7"><![endif]-->
<!--[if IE 8 ]>    <html class="ie ie8"><![endif]-->
<!--[if IE 9 ]>    <html class="ie ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html><!--<![endif]-->

Here is a patch that does the above on the alpha/templates/html.tpl.php, though I don't necessarily recommend that the module support this out of the box, you could use the patch as a starting point for overriding this in your own theme.

jwilson3’s picture

jwilson3
Primary language English
Location Ecuador
commented
Status: Active » Closed (works as designed)

As there are no stylesheet changes accompanying this feature request and no real need out of the box to support this, I'm gonna go out on a limb to guess that the maintainers probably won't want to add this to the theme by default. This is a perfect example of why we have the template file structure and override system: for implementing your specific needs in your own sub-theme.

UPDATE: rewrote the first sentence for clarity.

TelFiRE’s picture

TelFiRE commented

How is there no need to support this out of the box? Has anyone here ever worked on a website that didn't need a ie-specific style? I would be surprised because I've done hundreds of them and never come across that.

jwilson3’s picture

jwilson3
Primary language English
Location Ecuador
commented

If you actually read the CSS of Omega, it does contain IE-specific fixes embedded directly within its CSS. There hasn't been a need to target the browser using HTML-level classes for the theme itself to function, and thus it is left up to the site builder/themer as to which way s/he wants to handle IE theming. Of the many possible ways, this is just one.