mozilla

Revision 45596 of :required

  • Revision slug: CSS/:required
  • Revision title: :required
  • Revision id: 45596
  • Created:
  • Creator: Sheppy
  • Is current revision? No
  • Comment 12 words added

Revision Content

{{ CSSRef() }}{{ gecko_minversion_header("2.0") }}

Summary

The :required CSS pseudo-class is applied automatically to {{ HTMLElement("input") }} elements that have the required attribute set on them. This allows forms to easily indicate which fields must have valid data before the form can be submitted.

You may use the {{ cssxref(":optional") }} pseudo-class to provide an appearance for optional form fields.

Examples

See {{ cssxref(":invalid") }} for an example.

Browser compatibility

Browser Lowest version
Internet Explorer ---
Firefox (Gecko) 4.0 (2.0)
Opera ?
Safari (WebKit) ?

Specifications

See also

  • {{ cssxref(":optional") }}
  • {{ cssxref(":invalid") }}
  • {{ cssxref(":valid") }}

Revision Source

<p>{{ CSSRef() }}{{ gecko_minversion_header("2.0") }}</p>
<h3>Summary</h3>
<p>The <code>:required</code> CSS pseudo-class is applied automatically to {{ HTMLElement("input") }} elements that have the <code>required</code> attribute set on them. This allows forms to easily indicate which fields must have valid data before the form can be submitted.</p>
<p>You may use the {{ cssxref(":optional") }} pseudo-class to provide an appearance for optional form fields.</p>
<h3>Examples</h3>
<p>See {{ cssxref(":invalid") }} for an example.</p>
<h3>Browser compatibility</h3>
<table class="standard-table"> <tbody> <tr> <th>Browser</th> <th>Lowest version</th> </tr> <tr> <td>Internet Explorer</td> <td>---</td> </tr> <tr> <td>Firefox (Gecko)</td> <td>4.0 (2.0)</td> </tr> <tr> <td>Opera</td> <td>?</td> </tr> <tr> <td>Safari (WebKit)</td> <td>?</td> </tr> </tbody>
</table>
<h3>Specifications</h3>
<ul> <li><a class=" external" href="http://www.w3.org/TR/css3-ui/#pseudo-required-value" title="http://www.w3.org/TR/css3-ui/#pseudo-required-value">CSS 3 Basic User Interface Module</a></li>
</ul>
<h3>See also</h3>
<ul> <li>{{ cssxref(":optional") }}</li> <li>{{ cssxref(":invalid") }}</li> <li>{{ cssxref(":valid") }}</li>
</ul>
Revert to this revision