Menu
I am trying to get my website showing properly on ie6 and ie7 and they say that you must put use this statement:
<!--[if IE 6]> <link href="ie6.css" rel="stylesheet" type="text/css"> <![endif]-->
Now where do I put this statement in my HTML page?
EDIT:
So I've added this just after the doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org
/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--[if lt IE 7]><html class="ie6" lang="en"><![endif]-->
<!--[if IE 7]><html class="ie7" lang="en"><![endif]-->
<!--[if IE 8]><html class="ie8" lang="en"><![endif]-->
<!--[if gt IE 8]><!--><html lang="en"><!--<![endif]-->
<head>
In my style sheet ie6.css I've got this:
.ie6 #magazine_style_left {
position:relative;
float:left;
width:150px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:14px;
color:#999999;
font-style:italic;
line-height:18px;
}
.ie6 #magazine_style_right {
position:relative;
float:right;
width:519px;
border-left: 1px solid #F2F2F2;
}
and I've added the css on the same page and it still isn't working. Its like its not picking up / using the ie6 css
762
inside the head tag
<head>
<!--[if IE 6]> <link href="ie6.css" rel="stylesheet" type="text/css"> <![endif]-->
</head>
answered Jan 30 '26 21:01
It might help clarify things to mention this:
IE conditional comments, such as <!--[if IE 6]><![endif]--> can go pretty much* anywhere in the document. In the <head>, in the <body>, in an <li> element or <form>, etc. The content inside it (which can be anything*) will be rendered (or not) according to the rule used.
* There may be exceptions, but I'm not aware of any specific ones.
Knowing this, the question really boils down to "Where do I put a <link> tag", which is of course in the <head> as mentioned by the other answers.
There's another way to target IE, outlined here:
http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
For sometime now, the standards community has rallied around conditional stylesheets as a solution to the validation problem.
There are a few problems with it though:
- Conditional stylesheets mean 1 or 2 additional HTTP requests to download
- As they are in the the , the rendering of the page waits until they're totally loaded.
- Also – Yahoo's internal coding best practices do not recommend conditional stylesheets
- It can separate a single CSS rule into multiple files. I've spent a lot of time wondering "Where the eff is that rule coming from!?" when it turned out to be tucked away in a conditional stylesheet.
Here's my proposed solution:
<!--[if lt IE 7]> <html class="ie6"> <![endif]--> <!--[if IE 7]> <html class="ie7"> <![endif]--> <!--[if IE 8]> <html class="ie8"> <![endif]--> <!--[if gt IE 8]><!--> <html> <!--<![endif]-->Using the same conditional comments, we're just conditionally adding an extra class onto the html tag. This allows us to keep our browser-specific css in the same file:
div.foo { color: inherit;} .ie6 div.foo { color: #ff8000; }Plus it totally validates and works in all browsers.
I highly suggest this technique for attacking IE, definitely worth checking out.
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
