带有必需属性的W3C CSS Validator错误

Question

I'm getting the following error in the W3C CSS 3 Validator:

Unknown pseudo-element or pseudo-class :required

Required is a HTML5 input attribute. 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 code:

<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>

Doesn't W3C recognize the required attribute like a standard?

Answer 1

CSS3 includes the Selectors Level 3 API. Selectors 3 does not include the :required selector.

:required was introduced in Selectors Level 4 . Browsers support it, but it isn't part of the CSS3 specification and so will fail in a CSS3 validator.

Answer 2

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, now I've passed the W3C Validator :D