asked on

Conditional CSS

Hi,

I have the following code:

<html>

      <head>

            <style type="text/css">

            body
            {
                   [if IE] background-color : blue;
                   [if Gecko] background-color : red;
            }

            </style>

      </head>

      <body>

            <form name="form1">

            </form>

      </body>

</html>

It is not working as expected in IE 6.0. Can you please FIX this ?

Thanks

LAMASE

I don't know if IE6 supports that kind of styling... it seems that you need to install something for have that styles working
http://www.conditional-css.com/usage

try this, calling different styles in head section

<!--[if !IE]><!-->  
  <style type="text/css">@import '/media/css/c-css.php?b=nonIE';</style>  
<!--<![endif]-->  
<!--[if IE 6]>  
  <style type="text/css">@import '/media/css/ic-css.php?b=IE&v=6';</style>  
<![endif]-->  
<!--[if gte IE 7]>  
  <style type="text/css">@import '/media/css/c-css.php?b=IE&v=7';</style>  
<![endif]-->

Open in new window

Keep in mind that you can make everything in a common css file, then include different "patch" css files for different browsers.

ASKER CERTIFIED SOLUTION

LAMASE

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Dave Baldwin

@LAMASE's examples are correct. The conditional statements are in the HTML file and can control loading of additional CSS files but the conditional statements do Not work inside the CSS declarations or files. In addition, only IE will recognize them. Using [if Gecko] has no effect, Mozilla and Webkit browsers do not recognize such things.