Re: Scoped style sheets.

Ian Hickson wrote:
> On Mon, 14 Jul 2008, David Hyatt wrote:
>>> One more thing about <style scoped />.
>>>
>>> What would be a specificity of CSS rules in scoped style sheet? 
>>> Question is in markup:
>>>
>>> <html>
>>> <style>
>>>  body #content p { color:red; }
>>> <body>
>>>  <div #content>
>>>    <style scoped>
>>>        p { color:green; }
>>>    </style>
>>>    <p>what would be the color of this text?</p>
>>>  </div>
>>> </body>
>>> </html>
>>>
>>> It appears as <style scoped> should always be more specific than rules 
>>> in just a <style>. Yes/no?
>> My own opinion is that each scope should constitute a separate author 
>> cascade level.  This is how scoped stylesheets work in XBL.  So yes I 
>> agree with you and think the spec needs to be amended.
> 
> Actually XBL2 doesn't introduce a new cascade level. It just puts the 
> sheets in an order that puts them before the sheets in higher scopes:
> 
> # Sheets within each origin are always walked from the innermost shadow 
> # scope to the outermost shadow scope (with rules in the outermost shadow 
> # scope therefore overriding rules of equal specificity in the innermost 
> # shadow scope). With this ordering a binding that defines a widget can 
> # define a default look for the widget that can then be easily overridden 
> # by a client of the widget. For multiple bindings attached to the same 
> # element, the sheets are walked from the base binding to the most derived 
> # binding.
>  -- http://www.mozilla.org/projects/xbl/xbl2.html#binding3
> 
> HTML5 doesn't say anything yet about how scoped="" interacts with the 
> cascade; it just treats them like any normal author CSS rules.
> 
> I don't think we want to make them "stronger" than other rules. The normal 
> specificity rules are enough to handle this. Otherwise we end up making 
> authors of containing pages having to carefully use !important to override 
> scoped styles, which seems like requiring excessive force.
> 

Normal specificity rules will simply not work.
To be able to overweight global styles you will end
up with something like this:

<style>
   body.foo #content p { color:red; }
</style>
  <body>
    <div #content>
      <style scoped>
          body.foo #content p { color:green; }
      </style>
      <p>what would be the color of this text?</p>
   </div>
</body>

This will make scoped styles even more tied with
the position of scoped element. To overweight the rule
you will end with writing full paths of elements.
The whole system of styles (global+scoped) will become
even more fragile. At global level you will never be
sure what will override what. The same thing is about scoped
styles.

I propose to drop that <style scoped> feature then.
As, it seems, no one have clear idea of their purpose.

Otherwise we need to come up with at lest explanation
of <style scope> goals. What kind of tasks they are aimed
to solve, etc.

For me personally <style scoped> is s "componentization"
feature. <style scoped> should allow to share components
(DOM subtrees) accompanied with specific set of styles and
without pollution of the whole system.
This goal requires scoped styles to be isolated from
the rest of the DOM. And yet to work effectively.

Ideally it should be possible to say something like this:
<form>
   Date of birth:<!--#include virtual="components/calendar.fhtml"-->
</form>
and this should be sufficient to include the
component (that is markup+styles+scripts).


-- 
Andrew Fedoniouk.

http://terrainformatica.com

Received on Tuesday, 15 July 2008 02:20:28 UTC