W3C CSS Validator error with required attribute
I am getting the following error in the W3C CSS 3 Validator:
Unknown pseudo-element or pseudo-class: required
HTML5 input attribute required. My CSS works in IE10, Google Chrome and Firefox.
This is my CSS:
#reserved input:required {background:#eaeae6;}
#reserved select:required {background:#eaeae6;}
This is my HTML:
<section id="reserved">
<select id="hab" name="hab" title="Study or Apartment" required>
<input type="text" id="name" name="name" maxlength="50" style="width: 200px;" title="Name and Surname" required/>
</section>
Does the W3C recognize the required attribute as a standard?
source to share
CSS3 includes API Selectors Level 3 . Selectors 3 do not include a selector :required
.
:required
was introduced in Level 4 Selectors . Browsers support it, but it is not part of the CSS3 specification and therefore will not work in a CSS3 validator.
source to share
Thanks for your answer lonesomeday.
I change my css and create a class instead of the required pseudo-class like this:
#reserved .required-class {background: #eaeae6;}
<input class="required-class" type="email" id="email" name="email" pattern="[a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)*@[a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)*[.][a-zA-Z]{1,5}" style="width: 200px;" title="email" required/>
With this change I have now passed the W3C validation: D
source to share