Re: WebKit now supports CSS Variables

Francois Remy wrote:

> If we got the following situation :
> <head>
>    <link ... style1.css ... />
>    <link ... style2.css ... />
>    <link ... style3.css ... />
>    <script>
>        document.querySelector('html head').insertBefore(<link ... 
> style0.css ... />, document.querySelector("html head 
> link[href='style1.css']"));
>    </script>
> </head>
> What's the stylesheet that define the value of the constant (I suppose 
> that all these stylesheets define a new one) ?
> The stylesheets are loaded asynchronously. So, when they are loaded, the 
> DOM has already changed and style0.css is became the "first" stylesheet 
> of the document. If we follow your spec, the constant's value is gift by 
> the first stylesheet that define it. But then, the constant has been 
> overwrotten by JS and it's not sure for the admin that it's not possible 
> to override its constants. Yes, it's now a constant (style1>3 has no 
> more effect on the constant value), but the value of the constant can be 
> decided by JS.

Constant instantiation (use) happens at the moment of parsing.

So if you will define your style sheet as:

@const COMPANY_COLOR: #11A;

@import url(common.css);
@import url(specific.css);

then at the moment of parsing of common.css constants used there will be 
resolved to correspondent values or to none.

Any later DOM permutations should not affect specificity of selectors 
and should not change compiled CSS. That is so called perfect 

> If we want to continue to have style1.css has defining stylesheet, how 
> can this be done ?
> (=How can the UA know it's the first stylesheet that defined the constant)
>>> The DOM doesn't reflect the "primary" position of the stylesheet 
>>> (style0 can be inserted before style1)
>>> The load time is not a revelant information because stylesheet are 
>>> loaded asynchronously. (style2 can load before style1)
> Should the UA "keep" the order the stylesheet should be loaded ?  
> (style1, 2, 3, then style0)

According to specification (CSS21):
"if two declarations have the same weight, origin and specificity, the 
latter specified wins".

This means that UI shall behave as if it loads styles synchronously
(in single thread) and uses some global 'order' counter for CSS rules.
This is the only way of giving word "latter" reasonable meaning
in given context.

By the way: Shall we specify meaning of "latter" somewhere in CSS3 ?

It appears as "latter" means order in cause-effect chain rather
than anything close to real-time position of correspondent <style> or
<link> elements in the DOM.

Andrew Fedoniouk.

Received on Monday, 30 June 2008 18:17:16 UTC