CSS 3 UI :default Test

Test of the CSS 3 UI pseudo class :default.

Quoting dbaron we need to support: the default button (the one you get when pressing enter), the default selected item in SELECT elements and input type=radio / type=checkbox.

Specification in CSS 3 UI

Test

This form shows the controls that should support :default. The default controls have a (d) after them, and should be styled to: 

  width: 60px;
  height: 40px;
  border: 1px dashed red;

Form 1, test controls and input submit buttons:

Select:

Input, radio: Value 1 Value 2 Value 3 Value 4 (d)

Input, checkbox: Value 1 (d) Value 2 Value 3 (d) Value 4

Plain input:

Input, buttons: (d)

Change type of Submit 1:
Add/remove a new default button:
Add/remove a new button that should have no influence on the default:

Form 2, test submit buttons:

Plain input:
Submit buttons: (d)

Change type of Submit 1:

Form 3, form without submit button:

Plain input: