Conditional Comments : some help required please

[Williebee]

Could somebody please clarify the use of Conditional Comments for providing different rules for older IE versions

My site set up has the main xhtml files in the root directory, with directories below called css and images.

Problem 1

In my style sheet, one rule includes this ..

.box{ background-image:url(../images/beigebox44.png); }


but for older IE browsers, I’ll opt to use this image instead (the one without a dropped shadow effect on a transparent background)

../images/beigebox44.gif

Where do I put this

<!--[if lt IE 6.0]> <![endif]-->

Problem 2

Due to the way IE handles outset / inset borders differently to Firefox I also want to alter the CSS rule here too.

For Firefox border-color:#262e9a; but for IE #787FCD

Again, where does the Conditional comment go please

[Fang]

First the css for all browsers then IE in descending order

<link rel="StyleSheet" href="generic.css" type="text/css">
<!--[if lt IE 8]>
<style type="text/css">
</style>
<![endif]-->
<!--[if lt IE 7]>
<style type="text/css">
</style>
<![endif]-->
<!--[if lt IE 6]>
<style type="text/css">
</style>
<![endif]-->

or target individual IE browsers

[Williebee]

Thanks 'Fang'

Yep that's it .. I read about Conditional Comments ages ago, but having not used them at all, my mind had gone blank.

Now I see how easy it is to use them

As I have just a couple of issues I'll just add the new rules in the head section of each page; there's no need for a whole new style sheet

One again, thankyou !!

[Williebee]

Update !

I added this to the head section ofa page and for some reason it made a gap appear between the overall container and the top of the screen. What causes this please ?

<!--[if lte IE7]>

<style type="text/css">

#mininav li a{
border-color:#787fcd;
}

</style>
<![endif]-->

When I clicked on cut to remove this, the layout went back to normal, top of container right at the top of the screen.

I have this on top of my css file

*{
margin:0px;
padding:0px;
}

IGNORE THIS ... NO SPACE AFTER IE CAUSED THE PROBLEM SORRY !!!