Reseting CSS on div

Hi,

Have there been any discussions to allow defining a div that ignores any
styling defined outside it and only honors <style> tags defined within it?

I know this is a little bit more complicated than it seems, as we might
want to define some styling on the div itself as well.

But finer details aside, the use case is for when a third-party JS script
injects some HTML to the current DOM, without an iframe, and uses class
names that can conflict with class names already used by our site.

So, then, we can define a div, for example, like:

<style>.foo {} </style>
<div id="root" ignore-outer-stylesheets>
  <style>.foo { }</style>
</div>

And only the rules defined in the second <style> tag will be picked up by
#root and its descendants.

Best regards,
Behrang
http://www.behrang.org