W3C home > Mailing lists > Public > www-style@w3.org > April 2015

Re: CSS Classes Custom - by Leonardo Lima

From: Andrea Rendine <master.skywalker.88@gmail.com>
Date: Thu, 9 Apr 2015 15:51:56 +0200
Message-ID: <CAGxST9kTF1oWP-hrTifiitR=PnWEZsq=nE-xOdBegOdBtTGPDw@mail.gmail.com>
To: Leonardo Lima <leonardo403@gmail.com>
Cc: Fran├žois REMY <francois.remy.dev@outlook.com>, www-style list <www-style@w3.org>
Leonardo,
> :root{
>    %border{border-radius:10px;}
> }
the original syntax proposed in "CSS Extend Rule" does not take into accout
nesting rulesets.
That is, no {property} inside a {} block. Otherwise you'd end up looking
for where the placeholder has been defined and if it fits into
cascading/inheritance dynamics.
Instead, it would be better to simply define placeholders in "CSS global
scope" (the term is not precise but I hope it is comprehensible), so that
it is available in every rule block without having the need to nest it
inside :root (or anything else)
If you have
:root {
  %border{ /* properties */}
}
you can also have
main {
  %border{ /* other properties */}
}
But then consider
main div {
  @extend %border;
}
What %border block is to be considered?

IMHO it's better to just have global custom classes to be called where
necessary.
%border {
  /* properties */
}
Received on Thursday, 9 April 2015 13:52:28 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:39:30 UTC