:has() you done your homework?
Okay, it’s time to test your knowledge about a super cool CSS feature called :has(). What’s the difference between these two examples below?
.section:not(:has(h3)) {
border: 5px solid hotpink;
}
.section:has(:not(h3)) {
border: 5px solid hotpink;
}
Want the answer? Really? Okay then…
The first one means that if the section doesn’t have any h3, give the section a hotpink border. And the second one? It means if the section has any element that isn’t an h3, give the section a hotpink border.
Yep, read that once more…Did you get it right!?