The required Attribute

The Low Down

The required attribute marks any input/textarea as being required to have a value before the form can be submitted. Any fields with this attribute which lack a value will prevent the form from being submitted until the field does have a value.

• Any field using the required attribute must also have a name attribute. Fields without names are not a part of submission, so are ignored in validation.
• The first required field which has no value when a form is submitted will be forced into focus upon form submission (like a "hint" to fill it out).
• Possibly not as user friendly as JavaScript solutions which can check validation on blur (as you fill out the form), and display hints for more than one field at a time.
• In WebKit you can style the main validation element as:

  ::-webkit-validation-bubble-message {
    padding: 1em;
  }

• There is a CSS pseudo class selector for matching elements that are required:

  :required {
  box-shadow: none; /* Firefox (tested v6) adds red shadow by default */
  }

• Works on radio buttons. If you put required on one radio button (or all), that particular group of radio buttons will be required. On checkboxes, makes each individual checkbox required (to be checked).
• When used on password input type in Chrome 10, message becomes all bullets (•••••).