Why isn't my IE6 Conditional stylesheet not working? - html

This is driving me nuts. I'm trying to use a conditional IE6 stylesheet. I posted this test page here. Here is the code I placed in my head tags:
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->
The ie6.css should set the body background to red when viewed in IE6.
What's wrong here? I'm sure it's something dumb. Could someone please point it out to me?

It works fine for me. Run your test page through IE NetRenderer and you'll see the red background. Perhaps you're testing it in a version of IE other than 6?

You don't happen to be trying this using IETester?
Because with IETester, Conditional Comments will always resolve to the highest installed version of IE.

is the CSS file in the root folder (same folder as the HTML) ? it's good practice to put your CSS in a separate folder.
<!--[if IE 6]><link href="css/ie6.css" rel="stylesheet" type="text/css" /><![endif]-->

I just had a similiar issue. The conditional comments did not work correctly and I tried everything. The issue was that I had an X UA compatible meta tag in the header which obviuously influences the rendering. So keep watching out for that because that can be a reason.
<meta http-equiv="X-UA-Compatible" content="IE=7" />

Related

IE Glitch on Logo

I have a glitch on Internet Explorer (all editions, including 8+), where the logo is not displaying correctly. It is displaying perfectly on all other browsers, but the glitch is not being rectified by the file ie.css (which I believe should fix the existing issue. Any help would be greatly appreciated. The website is as below:
http://www.taray-investments.com/
Thanks in Advance
<!--[if lte IE 8]>
<link rel="stylesheet" type="text/css" href="/css/ie.css" />
<![endif]-->
Your code is only loading the ie.css if the version is less than or equal to 8
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="/css/ie.css" />
<![endif]-->
That will load if it's IE at all.
Of course as suggested using PNG instead of SVG is your main goal for old IE versions but I don't believe your site works under IE8- correctly anyway and it's (imo) ridiculous for clients to expect support for IE8- anyway.
I can only guess what is going wrong, but here are some possible problems:
1) Logo is not scaling correctly, in latest versions of IE
2) I saw some transitions in your code, so this might be the issue.
3) Any other svv background related bugs.
First can be fixed with svg inline attributes.
Second and 3rd are unfixable thou.
If you want to suppot any versions of IE older than 11, i suggest using .png instead of svg.

Including IE8 specific css kills page

I'm trying to make a couple of web pages work for a client in IE8, however I'm not getting anywhere at all.
I'm trying to include a css file to combat some of the issues, but whenever I include a stylesheet using:
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="ie8-2.css" />
<![endif]-->
everything below the header of the page disappears. Even if there is nothing in the stylesheet at all!
Any ideas why this might be?
Here's the page link, if anyone wants it.

Fixing column on table and preventing it looks bad in IE7

I read this answer to another so question, which is exactly what I need. Although, as stated in the answer, it looks bad in IE7. I would like it to look ok in IE7. The first column does not need to be fixed in IE<=7, but the table (and the first column) should be readable.
Does anybody have any idea how to hide some parts of the CSS in IE7, so it looks like a normal table? If so, you can always fork http://jsfiddle.net/emn13/YMvk9/ to show me :)
You could write a separate stylsheet for IE to use:
<!--[if IE]>
<link href="/style/ie.css" type="text/css" rel="Stylesheet" />
<![endif]-->
<!--[if !IE]>
<link href="/style/core.css" type="text/css" rel="Stylesheet" />
<![endif]-->
This will force IE to use the rules you specify in ie.css so you can give it the rules you want there. This will also hide the other parts that are used in Google Chrome and Firefox from IE.
The second stylesheet there will be used only if the browser is not IE so if everything displays correctly in Chrome and Firefox, you can leave those rules untouched. Then just copy the rules you need for IE into it's stylesheet.
Best practice is to write the CSS so that it displays the same in all browsers, but this is a lot less frustrating!
Hope this helps
Reference: http://www.quirksmode.org/css/condcom.html
I fixed the issues and attached the files http://jsfiddle.net/fJJvG/2/. One thing, you must download the jquery plugin from http://jquery.com/ and put in your header. then you will get the result.

Chrome loading IE only stylesheet

A stylesheet being loaded inside an IE conditional tag is being loaded in Google Chrome version 11.0.696.65. The IE only rules are throwing off our layout in Chrome.
<!--[if IE]>
<link href="/Content/site.ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
I've checked the code character for character and it looks fine to me. Is anyone else experiencing this? Is this a Chrome bug or some misguided feature?
Edit: Chrome is fine. We have a custom theme switcher which was erroneously loading a different copy of the site.ie.css from a theme's folder.
try
<!--[if gte IE 5]>
<link rel="stylesheet" type="text/css" href="style.css" />
<![endif]-->
It will target every internet explorer version above ie5, which should be the same as all ie versions. I have never had problems with conditional comments, not in Chrome or any other browser, but i always target only specific browser versions.
Im using the same version works for me on here. I would try reinstalling Chrome?
Chrome is fine. We have a custom theme switcher built which was erroneously loading a different copy of the site.ie.css from a theme's folder.

What broke? Site looks very different in IE vs Firefox/Safari

was working perfectly earlier this week, and now in IE everything seems to be messed up. Any ideas?
Specifically testing in IE 7/8
There's a stylesheet (http://www.currensee.com/css/blueprint/ie.css) being served to all versions of IE less than IE8 that's returning a 404. I'd bet that might be your culprit.
This line of code:
<!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
is using a relative path from your page.
Looks like it should be pointing at:
<!--[if lt IE 8]><link rel="stylesheet" href="/themes/currensee/css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
where the rest of your stylesheets live.
The problem is the comment on your first line. IE looks for the doctype there and, if there is none, goes into quirks mode. Remove that comment.
btw, you are using the XHTML 1.1 doctype which is an XML application but serving it as HTML. If you must use XHTML, change it to the 1.0 doctype. Not that it makes any difference since you aren't serving XHTML anyway.
I don't know whether it's the root of your problem, but your IE stylesheet
http://www.currensee.com/css/blueprint/ie.css
doesn't exist.