css conditionals

[Nick Wedd]

At present, I have some pages which include the lines

<style type="text/css">
@import url(../c.css);
</style>
<!--[if lt IE 8]>
<style type="text/css">
@import url(../ie.css);
</style>
<![endif]-->

so as to get them to render the way I want even with MS's defective
browser. This works. But it would be less messy if the conditional
stuff could be done inside my normal stylesheet c.css, instead of in
every page. Is there a way of achieving this?

Nick

 

[Harlan Messinger]

At present, I have some pages which include the lines

<style type="text/css">
@import url(../c.css);
</style>
<!--[if lt IE 8]>
<style type="text/css">
@import url(../ie.css);
</style>
<![endif]-->

so as to get them to render the way I want even with MS's defective
browser. This works. But it would be less messy if the conditional
stuff could be done inside my normal stylesheet c.css, instead of in
every page. Is there a way of achieving this?

There are hacks that exploit deficiencies in various IE versions to add
CSS that works only in or fails only in IE or particular versions. But
none of them is transparent; all require commenting if you expect to
remember why your code is the way it is the next time you look at it.

But you can cut out four lines from your code above by using LINK tags
instead of STYLE tags with the @import rule.

<link rel="stylesheet" type="text/css" href="../c.css">
<!--[IF LT ie 8]>
<link rel="stylesheet" type="text/css" href="../ie.css">
<![endif]-->

 

[dorayme]

At present, I have some pages which include the lines

<style type="text/css">
@import url(../c.css);
</style>
<!--[if lt IE 8]>
<style type="text/css">
@import url(../ie.css);
</style>
<![endif]-->

so as to get them to render the way I want even with MS's defective
browser. This works. But it would be less messy if the conditional
stuff could be done inside my normal stylesheet c.css, instead of in
every page. Is there a way of achieving this?

There are hacks that exploit deficiencies in various IE versions to add
CSS that works only in or fails only in IE or particular versions. But
none of them is transparent; all require commenting if you expect to
remember why your code is the way it is the next time you look at it.

But you can cut out four lines from your code above by using LINK tags
instead of STYLE tags with the @import rule.

<link rel="stylesheet" type="text/css" href="../c.css">
<!--[IF LT ie 8]>
<link rel="stylesheet" type="text/css" href="../ie.css">
<![endif]-->

And you can go further in reducing the "mess" you described by
either using your original or Harlan's and putting into an
"include" - which is usually a short sentence.