Remove/reset CSS behavior property
Is it possible to remove the IE-specific behavior CSS property via a more specific rule or the !important declaration? Example:
.a-rule { behavior: url(/some.htc); } .a-rule.more-specific { behavior: /*no HTC*/ }
I realize that overriding CSS properties is undesirable, but I'm stuck here.
On Edit: I'm not sure where people are getting confused about this question. For all purposes, you can consider this already being an IE specific stylesheet. I'm asking how, if .a-rule above exists and is immutable, how can one remove the behavior via a more specific rule? A standard CSS equivalent would be:
.a-rule { border: 1px solid black; } .a-rule.more-specific { border: 0 none; }
One can reset the border property for a subset of elements via a more specific rule. I'm asking how to reset the behavior property in an analogous way.
Answers
The default value is "none". See:
What is the *correct* way to unset the behavior property in CSS?
The solution:
.a-rule { behavior: url(/some.htc); } .a-rule.more-specific { behavior: none; }
.a_rule { border: 1px solid black; /* we know border is black */ behavior: url(/some.htc) /* we know something happen inside some.htc */ } .a_rule.more-specific { border: 0 none; /* we remove the border */ behavior: url(/some.htc) /* we remove something inside some.htc */ }
use different .htc file
Maybe use conditional tags for IE in your head
<!--[if IE]> <style type="text/css"> .a-rule { behavior: url(/some.htc); } </style> <![endif]-->