> * + * means?
.card > * + * {
margin-top: 3rem;
}
Does it mean, that inside .card, leave the first child, and give margin-top of 3rem to other children except first one, is that true?
4 Replies
iirc yes that is correct what you said
it's refereed to as lobotomized owl
+ is the ajacent sibling selector, it selects any element (the second *), that is directly following any element (the first *) that is a direct child (>) of .card.
So, yes your asumption is correct.
.card > *:not(:first-child) would be equal.
Except for higher specificity. (0,1,2) vs (0,3,1)So which one of them is the good practice to use?
If you want the clarity and don't care for the higher specificity of the later, take that. If you are confident your team will understand (or ask^^) the 'lobotomized owl' (i think it is called) and you care for specificity take the owl.