I need to understand how deselect works exactly and want to know if what I want to do is possible.
I know that I can select a parent element and then deselect some children inside it.
But is it possible to select X elements and filter those elements by deselecting some of them?
Here is an example, how would I select only prices before the hr tag?
I tried deselecting the prices after the hr tag but the preview still shows it. It seems I can only remove elements from inside selected items.
Thank you in advance for any advice you can give me
Hello @detectthis, thanks for sharing your use case. A deselection is used to exclude elements within an existing selection.
I could not access the example page on jsbin. Based on the screenshot, you can use following CSS selector to filter out the elements that you don’t need:
article.price:first-child, :not(hr) ~ article.price
article.price:first-child in case the first one is not preceded by any sibling element.
Will this work?
Hello, thank your for your answer
Sorry for the non-working jsbin, apparently a bug that can happen on their side. I opened an issue on their github.
Your answer wasn’t what I was looking for exactly (as it selected all prices) but it helped me find the solution
.price:not(hr ~ article .price) (I learned that complex selectors are now possible in :not)
Sounds good! I didn’t notice the space between
.price earlier. What you have makes sense. Cheers!