2 lines of code: Target IE6 IE7 CSS

Are you a designer who have had a hard time trying to maintain consistent styling across browsers like IE6 and IE7? Have you ever wondered if there is any simply solution to solve this problem? Here is a 2 line solution that will let you target IE6, IE7 CSS & solve this problem.

Target IE6 IE7 using CSS

Simply paste the following code in your CSS stylesheet & change the “id” and “class” names as needed:

#myelement
{
color: #999; /* shows in all browsers */
*color: #999; /* notice the * before the property - shows in IE7 and below */
_color: #999; /* notice the _ before the property - shows in IE6 and below */
}
.myelement
{
color: #999; /* shows in all browsers */
*color: #999; /* notice the * before the property - shows in IE7 and below */
_color: #999; /* notice the _ before the property - shows in IE6 and below */
}

In the code above, simply change #myelement if using ID or change .myelement to reflect the class of the element that you are using. Then re-declare the same style by appending * to fix the issue in IE7 & append _ to fix the issue in IE6, as shown in examples above. Hope that helps.

Your Turn!

Do you know of any other short cuts to target and make IE6 & IE7 using CSS obey the styling? Please share your tips with us by commenting below.