Hi all, I was given a link to this site which talks about using IE only conditional statments to fix annoying problems that occur in IE, but I'm not sure where to place them in the actual CSS.

Here's the site.
How To Create an IE-Only Stylesheet | CSS-Tricks

To target all version of IE it says to put...

Code:

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

But say I wanted to change something in IE on an hypothetical #leftcolumn where would this conditional statement go in

Code:

#leftcolumn {
                height: 400px;
          }

Say in Firefox the column I need was 400px, but in IE I needed it a little shorter like 380px. I'm not sure how to assign the conditional statment on that div.

Thanks guys!!

Hey Tygra..

You need a seperate css file for IE as for other browsers..

so in the page write:

HTML:

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

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

Then in the seperate .css files add the necessary attributes that apply.

So Scratj, you write

Code:

[COLOR=#000080]<link rel=[COLOR=#0000ff]"stylesheet"[/COLOR] type=[COLOR=#0000ff]"text/css"[/COLOR] href=[COLOR=#0000ff]"regular.css"[/COLOR] />[/COLOR]

[I][COLOR=#000080]<!--[if IE]>[/COLOR]
    [COLOR=#000080]<link rel=[COLOR=#0000ff]"stylesheet"[/COLOR] type=[COLOR=#0000ff]"text/css"[/COLOR] href=[COLOR=#0000ff]"all-ie-only.css"[/COLOR] />[/COLOR]
[COLOR=#000080]<![endif]-->[/COLOR][/I]

on the page I am working on in the head section of the HTML document?

I already have an embbed style sheet on the page to.

The first one I posted represents the one you already have.

Add the second IE ONLY one to your page in the head section.

Then in that .css file add the stuff that only applies to IE.

Simply add the following into your html 'head', it doesn't have to be an external css file if you don't want.

<!--[if IE]>
<style type="text/css">
#leftcolumn {
height: 400px;
}
</style>
<![endif]-->

You can also use IE conditional comments such as:

<!--[if lt IE 7]> for everything below IE 7
<!--[if gt IE 5.5]> for everything greater than IE 5.5

You can also add the following Meta tag to the head section to force IE8 to render the page as IE7, put before all CSS code though.

<meta h.t.t.p-e.q.u.i.v="X-UA-Compatible" content="IE=7" />

Removing the dots of course, I had to put them there to post.

Hey Tygra, would you consider your question answered to your satisfaction? Please let me know and I will mark this as solved.

Thanks