Re: [css3-cascade] browser specific CSS

2011-04-04 18:55 EEST: Tab Atkins Jr.:
> On Mon, Apr 4, 2011 at 6:47 AM, Mikko Rantalainen
> <mikko.rantalainen@peda.net> wrote:
>> The basic building block is as follows:
>>
>> @required
>> {
>>        p { background: black; color: silver; }
>>        em { color: white; }
>> }
>>
>> And if the UA does not support ALL the properties, ALL the selectors and
>> ALL the values, then it should ignore the whole block. In practice, all
>> current UAs must ignore this block (because those do not support
>> @required) and it would be fine.
> 
> Note that the better version of this also uses a "!required" value on
> properties that must be understood; in your version, it's impossible
> to use prefixed properties (even if they're incidental to the effect
> you're trying to achieve), as they won't be understood by other
> browsers.  Then, the set of rules is applied only if all the !required
> properties are understood; non-!required properties are ignored for
> this purpose.

Perhaps I'm a bit dump but I don't get why rules that are not required
should be put inside @required rule. If I have following rules:

p { color: white; } /* not required */
@required
{
 p { border-radius: 1em; padding: 1em; }
}

and I want to support hypothetical Mozilla browser without border-radius
but with @required and -moz-border-radius, I'd write

p { color: white; } /* not required */
@required
{
 p { -moz-border-radius: 1em; padding: 1em; }
}
@required
{
 p { border-radius: 1em; padding: 1em; }
}

That is, the UA should apply rules for both "-moz-border-radius" and
"padding" if supported. If UA does not support e.g. "-moz-border-radius"
then the whole @required rule will be ignored. The UA shall then examine
the next @required rule (it does not matter if previous @required rule
failed or not) and if it supports both "border-radius" and "padding", it
should apply the rules inside the @required rule block.

If I understood your "!required" feature correctly, you would write
something along the lines

p {
 border-radius: 1em;
 -moz-border:radius: 1em;
 padding: 0.5em !required;
}

Otherwise, an UA that only supports "-moz-border-radius" but not
"border-radius" wouldn't apply the style. I don't see how !required can
be used for multiple alternative methods for getting the same end result
in case each UA only supports one of the alternative methods and the
style requires that at least one of the alternative methods is successful.

Perhaps the version I'm suggesting should be called @transaction instead
of @required?

-- 
Mikko

Received on Tuesday, 5 April 2011 06:21:35 UTC