Plausible: has selector for invalid input CSS?-CodePudding

I have my element like this:

const Input = (props: InputProps) => (
  <div className={classes.InputElement}>
    <input {...props} />
  </div>
)

.InputElement::after:has(input:invalid) {
  content: 'Hello world';
  color: red;
}

But the code doesn't behave as intended. I was wondering if this is actually even feasible?

CodePudding user response：

I assume you're trying to add an after pseudo element to .InputElement if the input element has invalid, in such case: .InputElement:has(input:invalid)::after.

Otherwise you're querying for when the after pseudo element has input:invalid which it can't.