:valid pseudo-class doesn't match valid form element

Confirmed Issue #8114184 • Assigned to Rossen A.


Chris R.
Jul 8, 2016
This issue is public.
Found in
  • Microsoft Edge
  • Internet Explorer
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

  1. Open the attached example in Edge.

Expected result:
I should see a green rectangle next to the text input.
This rectangle is the form tag, and since it contains no invalid form controls, it should match the form:valid selector in the CSS, and thus become green.

Actual result:
I see a red rectangle next to the text input, indicating that the form tag doesn’t match the :valid CSS pseudo-class.

See also: https://github.com/Fyrd/caniuse/issues/2384


1 attachment

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “Ibrahim O.”

    Changed Assigned To to “Bogdan B.”

  • I would expect, in most cases that people will include validation expectations in conjunction with that of the :valid pseudo class. We should fix this, but I think it’s relatively low priority.

  • Microsoft Edge Team

    Changed Status to “Confirmed”

    Changed Assigned To from “Bogdan B.” to “Rossen A.”

You need to sign in to your Microsoft account to add a comment.

Sign in