Associating multiple selectors with a pseudo-class

Question

Is there a way to have several selectors associated with a pseudo-class?

In other words, I want to make it so if an anchor, image, or button are hovered or focused on, they'll have a special border around them.

I tried this (shot in the dark):

(a,button,img):hover, (a,button,img):focus {
    border: 2px dashed black;
}

But Webstorm doesn't like it, and it doesn't activate.

I know that this works:

a:hover, a:focus {
    border: 2px dashed black;
}

But I'd like to be able to have it to apply to other selectors as well, without needing to repeat myself many times to apply it to all of them.

Answer 1

Your shot in the dark is actually very close to what's proposed for Selectors 4, except it takes the form of its own pseudo-class, :matches() (with the parentheses and the same comma-delimited syntax):

:matches(a, button, img):hover, :matches(a, button, img):focus {
    border: 2px dashed black;
}

which can be further simplified to:

:matches(a, button, img):matches(:hover, :focus) {
    border: 2px dashed black;
}

As it's not yet implemented outside of internal prefixes, you'll have to make do with writing it all out manually in the meantime:

a:hover, button:hover, img:hover,
a:focus, button:focus, img:focus {
    border: 2px dashed black;
}

Or make use of a preprocessor to do all the heavy lifting for you.