Search
Close this search box.

Declare different CSS rules for Firefox and Internet Explorer 7

The post Creating different CSS style selector definitions for different browsers (Firefox, Internet Explorer 7 and IE 6.0) with subsequent comments desribes that

You can have the same attribute for different browsers in the same rule by specifying # and _ prefix

.context_bar_form_field
{
height: 15px;/* apply to all browsers */
#height: 15px;/* override for Microsoft Internet Explorer browsers*/
_height: 21px; ;/* override for IE browsers 6.0 and older */
}
Alternatively you can use Conditional CSS stylesheets for Internet Explorer
<!--[if gt IE 5]>
<style type="text/css" media="screen">
.idonnyCSS{font-size: 1.3em }
/*The above CSS definitions will only be applies to IE versions greater than 5*/
</style>
<![endif]-->

I prefer the first opton for small changes to keep all definitions for the class/selector in one place.

CSS Filters chart describes will the browser apply the rule(s).

More discussion are in http://24ways.org/2005/avoiding-css-hacks-for-internet-explorer

This article is part of the GWB Archives. Original Author: Michael Freidgeim’s Blog

Related Posts