It's 2 classes, but I think here the idea is not so much "nested" as
"both".
So the rule with .ng-hide-add.ng-hide-add-active will be applied to classes
that have both classes.
You had the following CSS rules:
.ng-hide-add.ng-hide-add-active,
.ng-hide-remove {
opacity: 0;
}
.ng-hide-add,
.ng-hide-remove.ng-hide-remove-active {
opacity: 1;
}
So <div class=''.ng-hide-add"> matches the second rule and will have
opacity 0.
<div class=''.ng-hide-add .ng-hide-add-active"> matches the first rule and
will have opacity 1.
On Tuesday, May 19, 2015 at 10:07:37 PM UTC-7, Gas Creature wrote:
>
> I'm learning basic animation in Angular and came across some hook CSS
> classes.
> Here is the little demo: http://plnkr.co/edit/6vT4gonxU4OPwT14eqg2
> My question is: What is the construct called, the ones that look like....
> .ng-hide-add.ng-hide-add-active
> Is that a single class (ng-hide-add.ng-hide-add-active) or is it some
> kind of nested class construct, sort-of like ng-hide-ad > ng-hide-active ?
> I've never seen such a CSS declaration before in my, admittedly brief,
> readings about CSS.
>
> Clarifications about what this is would make me "feel better" :)
>
>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.