Seemingly Simple CSS Exception

[jpr28x]

Posts

[jpr28x]

This is driving me absolutely crazy. Because I have successfully used these before. I apologize for how detailed this is, but I didn’t to miss anything. Anyways,

I have a main CSS page, with all my CSS on it, call it “main.css”. I then copied and pasted it, changed several things so it would look well in pre-ie9 browsers, and renamed this new css page to ie.css.

I planned on putting in the head of all pages, (used $ instead of brackets< >, sorry), the main one: $link href=”main.css” rel=”stylesheet” type=”text/css” /$
and then the to include other file:
$!–[if IE 7]$
$link href=”ie.css” rel=”stylesheet” type=”text/css” /$
$[endif]–$
or
$–[if IE 8]$
$link href=”ie.css” rel=”stylesheet” type=”text/css” /$
$![endif]–$
or
$!–[if ltIE 9]$
$link href=”ie.css” rel=”stylesheet” type=”text/css” /$
$![endif]–$

BUT, no IE browsers 7 or 8 will pick up the exception file. They just use the main one, without the changes they need to look correct.

If there is a main css file, outside of exception brackets, no browser will read the exception files.

IF I ONLY USE EXCEPTIONS: It works. I made a page and JUST put this in it:
$!–[if IE 7]$
$link href=”ie.css” rel=”stylesheet” type=”text/css” /$
$![endif]–$

And it works fine in ie7 browsers. But, obviously, I need the main one in there for when any other browser is used.

This is driving me nuts. It has to be something simple. And I apologize if there is an obvious problem here. I am by no means a newbie, but (clearly) I am not an expert.

I use a DWT template file I made to update the header of all of my pages. Not sure if that matters, I’ve used successful ie exceptions with other DWT based websites.

I’m sure it might be something else, so feel free to ask me any questions. THANKS SO MUCH!

[TT_Mark]

I’m pretty sure this is wrong. Should be a space between the lt and IE

[jpr28x]

Hm Thanks. However, the other ones aren’t working either.

I was trying to figure out EVERYTHING, so I made several without the [if lt IE 9]

and just made an exception for ie7 and ie8 as shown above.

[jpr28x]

Ok, Does the order in which I place the Linked-css files and exceptions for linked-css matter?

It looks like it does, and that may be part of the problem here?

[Mottie]

The order does matter, but since it appears you are including the same ie.css file, just use the code that @TT_Mark has above since it uses a less than (lt) IE9 conditional comment (with a space between “lt” and “IE” of course :P).

[jpr28x]

Thanks Mottie! So how does the order affect it, in terms of which CSS statements end up being displayed on that page. Latter CSS sheets will override the former ones? Or Vice Versa?!

So say I have this

MAIN CSS for IE9/everything else
MAIN CSS with a few things changed for IE7/IE8
then a IE9 only CSS with just two total statements, different from the first Main one.

Would that combine the first and 3rd when IE9 is present, or will it just use the last one, and therefore not have what it needs from the first?

I know this is probably newbie crap, I apologize.

[Author]

Posts