1 Reply Latest reply on Jun 11, 2012 3:53 PM by Kris Borchers

    IE Conditional CSS

    lholmquist Newbie

      This is really a questions,  i just thought this might be helpful to others.

       

      This is one way of having differnt styles for different IE browsers.

       

       

      I have this at the top of my html

       

       

       

      <!DOCTYPE html>
      
      <!--[if lt IE 7]> <html class="no-js  lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
      <!--[if IE 7]>    <html class="no-js  lt-ie9 lt-ie8" lang="en"> <![endif]-->
      <!--[if IE 8]>    <html class="no-js  lt-ie9" lang="en"> <![endif]-->
      <!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
      <!--[if !(IE)]><!--> <html class=""> <!--<![endif]-->
      
      

       

       

      then in my style sheet i have something like this

       

       

       

      .screens
      {
      
      ... some styles
      
      
      }
      
      
      .lt-ie8 .screens
      {
      
      ....slightly different styles
      
      }
      
      
      
      

       

       

      I got this from paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/

       

      also similar to how modernizer works with adding values to the html tag

        • 1. Re: IE Conditional CSS
          Kris Borchers Newbie

          Just FYI, if you read the updates to that article, this should really be used as a last resort. You can usually get all versions of IE very close to how the other browsers look just by adding a couple of lines to your CSS to make element selecting a little more specific or adding a height or width to an element. The less you can do that is browser specific the better because then it's a lot easier to maintain when the browsers inevitably change how they do things again.