Hacks to single out IE5.01, IE5.5, IE6, IE5-Mac and standards browsers

admin

Administrator
Staff member
I just accidentally ran into a CSS parsing bug that seems to be only in Internet Explorer 5.5-Win.

.someClass,
/* Comment prevents IE5.5-Win from applying these styles */
.someClass { /* Ignored styles */ }

I've built a more complete code example below that feeds a different background color to Standards browsers, IE5-Mac, IE5.01-Win, IE5.5-Win, and IE6-Win.

<!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" xml:lang="en" lang="en">
<head>
<title>IE5.5 and 5.01 hack</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css" media="screen">
<!--
/* IE5-Mac reads this. */
div { background-color: grey; }

/* ############### IE5-Mac ignores the following rules: ############### \*/
div { background-color: red; } /* Standards browsers \*/

* html div { background-color: green; } /* Only IE 5.5 gets this \*/

* html div,
/* This comment keep IE5.5-Win from applying styles to <div> tag \*/
* html div {
background-color: blue; /* IE 5.01-Win gets this \*/
voice-family: "\"}\"";
voice-family: inherit;
background-color: yellow; /* IE6-Win gets this \*/
}
/* ######################### End IE5-Mac hiding ######################## */

.fixIE501 { /* IE 5.01-Win often ignores rule after voice-family hack */ }
-->
</style>
</head>
<body>
<div> </div>
</body>
</html>

Thoughts?Does it work in quirks mode as well? I use the xml prologue and that throws IE off into quirks mode.Yes indeed it does.

<?xml version="1.0" encoding="utf-8"?>
<!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" xml:lang="en" lang="en">
<head>
<title>IE5.5 and 5.01 hack</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css" media="screen">
<!--
/* IE5-Mac reads this. */
div { background-color: grey; }

/* ############### IE5-Mac ignores the following rules: ############### \\*/
div { background-color: red; } /* Standards browsers \\*/

* html div { background-color: green; } /* Only IE 5.5 gets this \\*/

* html div,
/* This comment keep IE5.5-Win from applying styles to <div> tag \\*/
* html div {
background-color: blue; /* IE 5.01-Win gets this \\*/
voice-family: "\"}\"";
voice-family: inherit;
background-color: yellow; /* IE6-Win gets this \\*/
}
/* ######################### End IE5-Mac hiding ######################## */

.fixIE501 { /* IE 5.01-Win often ignores rule after voice-family hack */ }
-->
</style>
</head>
<body>
<div> </div>
</body>
</html>Pretty cool. I've had problems in the past where I can get stuff to work in 5.5 and 6 but not 5.01 or 5.01 and 5.5 but not 6.0. It can get frustrating. :@

I hate IE.
 
Back
Top