# A use case for :is

I've known that `:is` and `:where` have existed for a while. But I hadn't seen a reason to change my autopilot of comma separation. Until recently.

I had a situation where I really wanted to use `:has`. But it's not quite ready for production code yet (it's not in Firefox at all, which is my favourite browser). The easy solution was to use JavaScript to add a class, which I could use instead of `:has`. But I thought I'd do some future-proofing and use `:has` anyway, so if someone has no JavaScript in their browser, but with a new enough browser where `:has` works, the styling I needed to do would work for them.

So that was fine and I ended up with this bit of CSS:

```css
div:has(img),
div.has-image {
  /* styling goes here */
}
```

This worked fine in Chrome, but Firefox ignored all of that styling. That's because it didn't understand the first line, so it ignored the whole thing.

But `:is` works because if it doesn't understand something, it only ignores the bit it doesn't understand. So changing the code to this made it work in Firefox:

```css
div:is(:has(img),has-image) {
  /* styling goes here */
}
```