A Easy Way To Solve The Wellknown Ie Css Problem (not A Hack)

[lihuyt 0]

Hi everybody

 

I have been working for some time with css code, and on every site I have made I have had one big problem when it comes to IE. I have watched mulitple bugs with css in IE, but the most irritating one is the following:

 

IE missreads parameters like height & width so that your code that was perfect in FF, is now useless in IE. Whell, I have a solution, which in my opinion is not a hack, and works much better, atleast for me.

 

The whole thing is just a javascript on a couple of lines that goes in the header, and then you make separate css-files for IE and FF + other.

 

- First you make two .css-files, and in this example I name them "ie_only.css" & "not_ie.css".

 

- Second you go into the header of your html file (or other type), and write the following:

 

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

The first if, [if IE] asks the browser if it is IE.

The second if, [if !IE] really says "If not IE"

 

You could also possibly make the script ask for more browsers, but I did not need this for my use.

 

I hope this little script helped some.

 

I am open for comments.

[FLaKes 0]

hmmm, sounds good to me. About a couple of years ago, I stumbled across this idea but it was heavily criticized for having 2 css files and relying on javascript. But hey, ajax is really popular now and its full of javascript, so I think that this solution is really good that way you dont have to have hacks all over your code, which might even make the styles sheet lighter.