Make IE6 emulate IE7 or IE8!

IE6 is fast becoming an outdated browser, but the fact remains that 11% of users on the internet still use IE6 (according to w3schools.com statistics).

PNG transparency has been of the most annoying issues to deal with in IE6. Any webmaster who has faced this problem, has used either IE PNG Fix or jquery.pngFix.js PNG-Transparency.

IE :hover is another area which plagues not only IE6 but some of it's later incarnations as well. Whatever:hover is a small script that automatically patches :hover, :active and :focus for IE6, IE7 and IE8 quirks, letting you use them like you would in any other browser.

Another way to make IE6 emulate IE7 would be to use the IE7.js Javascript Library. IE7.js is a JavaScript library to make IE6 emulate IE7. This library fixes many CSS and HTML issues developers are constantly trying to deal with.

To apply the library to your website, you need to add the following code just before the </head> tag:

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
<![endif]-->

Some of the most important issues this library fixes are mentioned below:

CSS Selectors

parent > child

.multiple.classes

:hover

:first-child

[attr]

[attr="value"], [attr~="value"], [attr|="value"], [attr^="value"], [attr$="value"]

[attr*="value"]

CSS

Background-image – PNG alpha transparency (IE5.5+)

Background-attachment – Support fixed positioning

Position – Support fixed positioning

Margin – Support auto (IE5.x)

Cursor – Support pointer for IE5.x

Display – Convert list-item to block for IE5.x

HTML

img – PNG alpha transparency

abbr – Bug fixed

Please note that if Javascript is turned off, this trick won't work.

You can even make IE6 emulate IE8 if you wish! IE8.js is a JavaScript library to make IE6 emulate IE8. To apply the IE8.js library to your website, you need to add the following code just before the </head> tag:

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
<![endif]-->

Note: You don’t need to include the IE7.js if you are using IE8.js.

For more information, visit the ie7-js Google Code page here.

These tricks should help solve some of the issues with IE6 atleast until IE6 is completely eradication from the internet.

To force IE8 to render a page like IE7, please read my earlier post here.

Share |