Doing something to parent when a specific child has focus

Hi guys, I’m working on a todo project and wondering if there’s a pure CSS solution to a problem I have. I have a todo, and it has (among other things) a button in it. When that button receives focus, I’d like some style changes to happen to the parent todo. I realize this can be done in JS by listening for “focusin” and “focusout” events, but this seems like overkill… Based on what I read this seems not to be possible, but I figure it’s worth a shot to ask anyway.

Research the :focus-within pseudo-class. Here is the browser support for it (which is not that great).

1 Like

Thank you! That is a cool pseudo-class. I still don’t know if it’s possible to do something only when a specific child has focus, but I’ll do some more googling.