Re: Multiple assignment structure (suggestion)

On Wed, Nov 26, 2014 at 2:52 PM, Felipe Nascimento de Moura
<felipenmoura@gmail.com> wrote:
> I was wondering if this would make any sense to you.
> If someone has already suggested it, or it has already been discussed,
> sorry, but I couldn't find it(may, a different name?).
>
> The idea is to add a syntax support to set properties like this:
>
> selector-1,
> selector-2 {
>     border:
>     padding:
>     opacity:
>     margin: 0;
>     position: absolute;
>     left:
>     top: 0;
> }
>
> This would helps us have even smaller css files.
> Another example:
>
> selector-1,
> selector-2 {
>     color:
>     border-color: #009;
> }
>
> What do you think?

It looks like you're trying to save yourself some typing/maintenance
by making an omitted value just take the value of the next property in
the style rule, yes?

If so, your solution isn't very powerful.  It's impossible, for
example, to reuse a color in both 'color' and 'box-shadow', because
the grammars are different.

Instead, you should use a custom property
<http://dev.w3.org/csswg/css-variables/> to store the common value,
and then access it with var(), like:

selector 1,
selector 2 {
  var-main-color: #009;
  color: var(main-color);
  border-color: var(main-color);
}

~TJ

Received on Wednesday, 26 November 2014 23:52:46 UTC