Conditional comment, @import malfunction

Hi there,

I’m doing this site and using transparency on webkit and mozilla browsers, which of course dear old IE doesn’t support. I’ve tried the IE opacity filter without much success and have resorted to @import to bring in the changes I have made to make IE acceptable(?).

However, although the Conditional Comment (below) brings in the Google Shim which converts IE to Html5, it refuses to @import the IE stylesheet. It even won`t work when I link the stylesheet.

The CC is fine because as I said, it brings in the Google Shim and it also makes the changes when I put the styles into the Conditional Comment.

Can anyone offer any advice on how I can get the @import to work, please.

Below are the malfunctioning @import and linked stylesheet and the functioning styles. I’ve also tried [if lte IE 8], but that doesn’t work either.

I’ve uploaded a @import example at:
http://www.eftharmony.co.uk/index_2010.html Compare IE and FF or Safari.

<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<style type="text/css">
@import url("../css/ie_2010.css");
</style>
<![endif]-->


<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<style type="text/css">
<link rel="stylesheet" type="text/css" href="../css/ie_2010.css">
</style>
<![endif]-->


<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<style type="text/css">
#wrapper {
	background-color: #9c7ea7;
    }
 section#leftContent {       
        background-color: rgb(228,205,236);
    }
section#rightContent {	
	background-color: rgb(228,205,236);	
}
blockquote {
	background-color: rgb(62,41,70);
    }
</style>
<![endif]-->

Thanks Paul, the page I posted was at the end of a long and frustrating session. I swear that I wasn’t that careless all the way through. I’ve copied your correction and uploaded it. It doesn’t seem to work on my local computer copy, but it appears much better on the uploaded version. I’ll try it with the transparency filter and maybe ever some webfonts that I have had little success with so far.
Thanks, you have the magic touch.

Hi,

You have an extra single quote character at the end of the import which corrupts it.


@import url("/css/ie_201[B]0.cs"')[/B];    


It should be:


@import url("/css/ie_2010[B].cs"); [/B]   


I’m also assuming that it should be css and not just cs :slight_smile:


@import url("/css/ie_20[B]10.css[/B]");