Member Avatar for T4gal

Hello,

I'm trying to use conditional stylesheets to create a separate stylesheet for IE, but the stylesheets will not load for me. This is what I have:

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

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="style-ie.css" />
<![endif]-->

I have also tried:

<link href="style.css" rel="stylesheet" type="text/css" />


<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="style-ie.css" />
<![endif]-->

With the first one, none of the styles load. My page has no CSS. With the second, only the standard one loads, the IE one does not. What am I doing wrong here?

Thanks in advance.

The only problem I see is with the first one. Targeting non IE browsers should be like

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

If the second example isn't working, something else must be wrong.

Member Avatar for T4gal

I just tried changing that, all that does is allow the default stylesheet to load. The IE one still doesn't load.

It seems to me that adding these conditional comments is just commenting out the stylesheet link. Am I missing something here?

The IE one is conditional because IE is the only browser that doesn't ignore it like a comment. The other browsers see it is a comment and continue on with their business of rendering the rest of the page.

The issue is most likely your style sheet, either the link is wrong, or you are not overriding the styles correctly.

Are you setting things with !important on them? like this:

div{background:#FFFFFF !important;}

According to quirksmode, the syntax for !IE should be:

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

You wouldn't happen to have a URL we could check, would you?

Member Avatar for T4gal

I just tested it in IE 9 and it's working. I had been testing it in IE 10. I never even thought to test it in another version of IE.

So is this not possible in IE 10? How would I go about doing this for IE 10?

Member Avatar for T4gal

Sorry, just did a google search about IE10 and found out that conditional comments are not supported. I just assumed IE10 would support it like the rest. Looks like I'm going to have to find another way around this.

Yea, that's correct. Its been dropped by IE10. However, you could always have the browser emulate IE9 behaviour, but I'm not saying that you should.

Here is more information on MSDN about that: Conditional Comments

It may be that your CSS could be wrong, or could be done differently. Unless it's a IE10 bug which happens also. Start another thread with the CSS issue. I'm sure we could help.

Member Avatar for T4gal

Okay, I will look into that, thanks.

I'll look and see if I can get it working by just adjusting the CSS first.

Thanks for the help.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.