sass - Can I detect element visibility using only CSS?

Question

I checked the API for some pseudo-selector such as :visible or :hidden, but was disappointed to find no such selector exists. Since jQuery has supported these selectors for a while now, I was hoping they'd be implemented. The idea is, that I'd like to show a certain element only when the element next to it is hidden, but I don't want to use JavaScript to do so. Any options?

Answer 1

No, it is not possible and can't be possible, at least in stylesheets.

Otherwise, you could create an infinite loop:

element:visible {
  display: none;
}

The element would be visible at first, then the selector would select it and hide it, then the selector wouldn't apply and it would become visible again, etc.

It would be possible to allow that pseudo-class only in JS APIs like querySelector. But as far as I know there isn't anything like that, and it wouldn't be CSS-only.