[width,css] if ie: <link ....</link> else: <link>...</link> <!--[if IE 8

if ie:
      <link ....</link>
   else:
      <link>...</link>
   
<!--[if IE 8]>
        <link rel="stylesheet" href="css/ie8.css"/>

<![endif]-->
   
@media all and (min-width:500px) { … }
(to be continue...) (continue)
@media (min-width:500px) { … }
   
<!--[if IE 8]>
  <link rel="stylesheet" href="ie8.css"/>
Special instructions for IE 8 here
<![endif]-->
   
<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="css/ie.css" />
<![endif]-->
   
<!--[if !IE]><!-->
    <link rel="stylesheet" type="text/css" href="css/non-ie.css" />
<!--<![endif]-->
   
@media screen and (max-width: 699px) and (min-width: 320px) {
   div { background: blue; width: 100px; height: 100px; }
}


@media screen and (max-width: 1024px) and (min-width: 700px) {
   div { background: green; width: 300px; height: 100px;  }
}


@media screen and (max-width: 1280px) and (min-width: 1025px) {
   div { background: red; width: 600px; height: 100px;  }
}​

Date: 2012-11-03 13:06:02 and last modified: 2012-11-03 13:06:02