A change is coming to our CSS implementation to make it "more standard" and to make it work properly. The change is backward compatible (as much as I can make it), but I am emitting a warning when back-compatibility mode is triggered, so you can adjust your code. There will surely be a number of warnings in existing CSS-styled code. This change will be available in the nightly builds in a day or so.
Summary: CSS-styled attributes will no longer 'inherit' (get their value from an enclosing node) by default. There is a new mechanism to override this default. Details: a) Standard properties will only inherit if they are defined to do so by the W3 standard: http://www.w3.org/TR/CSS21/propidx.html b) Custom CSS properties default to not inheriting. c) The CSS `inherit` keyword can be used in a stylesheet to make any CSS property have the inheriting behavior (where the CSS rule is applicable). d) There is a new property of <attribute>, when you specify `style="property"`, you can also specify `inherit="true"`, to make that CSS property inherit. e) For backwards compatibility, when there is no local applicable CSS style property, but there is an inheritable property, the inheritable property will be used. In debug mode, you will get a warning, in case this is not the intended behavior. The warning will give instructions on how to change your code to silence the warning (i.e., to make the inherit behavior explicit). Concrete example: <stylesheet> groovystyledbox { stylebgcolor: #515151; styleinnercolor: #FF8888; } </stylesheet> <class name="groovystyledbox" bgcolor="$style{'stylebgcolor'}" > <view name="inner" bgcolor="$style{'styleinnercolor'}" /> </class> <groovystyledbox id="lecithin" width="150" /> In this case, the test designer assumed that `styleinnercolor` on <view> will be inherited from its parent <groovystyledbox>. But `styleinnercolor` is not one of the CSS properties that inherits. With the change, you will get the following warning: > WARNING: #lecithin/@inner.bgcolor: No applicable value for CSS property > 'styleinnercolor', however there is an inheritable value `'#ff8888'`. > Use `<attribute name='bgcolor' style='styleinnercolor' inherit='true' />` to > inherit that value and silence this warning. > INFO: Use `Debug.explainStyleBindings(#lecithin/@inner, true)` for more > information. To silence the warning, the inheritance of the custom CSS property needs to be declared when it is defined: <class name="groovystyledbox" bgcolor="$style{'stylebgcolor'}" > <view name="inner"> <attribute name="bgcolor" style="styleinnercolor" inherit="true" /> </view> </class> Alternatively, the stylesheet could have the added rule: groovystyledbox view { styleinnercolor: inherit; } While this has the same effect, it separates the inheritance from the definition of the property, so is not the recommended practice.
