conditional css

[taurus2006]

Hello everyone,

Is there a way to make a conditional property within a css file ?

For eg:

.one{
top:-10px;
height:20px;
width:100px;
}

can I make any one property like width:100px applicable to IE6 only and not for any other version of IE or any other browser?

Thanks in advance!

[ssbeats]

hi.
i dont think you can add conditional properties within a single css file.
you best bet is to add a new stylesheet e.g ie6.css and add the property there.

then add a line of code to your head...

<!--[if IE 6]><link rel="stylesheet" type="text/css" media="screen" href="css/ie6.css" /><![endif]-->

Is that what you were asking?

[ssbeats]

sorry you meant a single property like width.

i only know of the !important hack but i think this covers ie7 as well (not sure though)

.one{
top:-10px;
height:20px;
width:100px; !important
width:110px; //this one for IE
}

[taurus2006]

<!--[if IE 6]><link rel="stylesheet" type="text/css" media="screen" href="css/ie6.css" /><![endif]-->

Thanks a lot for the reply ssbeats! Yes, I did try using a new css file for IE6 but the problem is that the loading doesnt take place smoothly.The browser applies the default styles first and then later load the styles for IE6 and for a second or two the screen keeps adjusting till the final settings are applied.Thats the reason I was wondering if there is any way to use conditions in a single css file.

-Thank You!