When you see two CSS selectors can you always say which one has a higher specificity? For example, which of the following selectors would overrule the other?
div.products li > *[data-name="test"] a
I don’t always know with some of the more complicated selectors, so I made a little web app to figure it out for me: specificity.keegan.st
npm install specificity