CSS parent combinator

In an web application I'm working on I have a list of thumbnails to choose from. The HTML looks like this:

<dl>
  <dt><input type="radio" /></dt>
  <dd><img src="thumb.jpg" /></dd>
  ..
</dl>

Since the thumbnails are much bigger than the radio buttons it is hard to spot the selected image. I thought it would be nice to style the image based on the radio button's checked state. Too bad CSS doesn't have a parent combinator to use in the selector. I would have liked to use something like this:

input:checked < dt + dd img {
  border: 2px solid black;
}

This would also be useful to style selected rows on checkboxed tables.

When I was looking for a parent combinator I found out I wasn't the only one who would like to have a parent combinator.

Tags:

• CSS
• Combinator
• Selector