Question

I’m trying to override a few CSS selectors that are causing problems in IE6 by using the following code inside the head tag in an HTML file:

<!--[if IE 6] <style type='text/css'>     @import ('ie6.css'); </style> <![endif]--> 

This code comes after the main stylesheet loads, and no other stylesheets get loaded after the conditional comment. For some reason, browsing the site using IE6 doesn’t load the IE6 CSS file. I’ve tried numerous variations on the syntax and I’ve also tried using a link tag instead of style import, all to no avail.

I do have some JavaScript that dynamically alters some style properties for the same elements that the selectors are for, but I don’t think that is the problem because when I just replace the same selectors in the main CSS file, everything works as expected. So it would seem that the IE6 CSS file never loads.

Answer 1

Actually you only left out the closing bracket for the opening conditional comment tag [if IE 6]> <—-

<!--[if IE 6]> IE6 stuff here. <![endif]--> 

Also, you may want to do the @import with either url(‘ie6.css’); or just the quotes.

@import url('ie6.css'); @import 'ie6.css';