Radio buttons in HTML

One choice from several: the shared name is what makes them a group.

<fieldset>
  <legend>Test length</legend>
  <label>
    <input type="radio" name="limit" value="30"> 30 seconds
  </label>
  <label>
    <input type="radio" name="limit" value="60" checked> 1 minute
  </label>
  <label>
    <input type="radio" name="limit" value="300"> 5 minutes
  </label>
</fieldset>

How it works

1. Radios with the same name are mutually exclusive.
2. Each needs its own value and its own label.
3. Marking one checked avoids an empty default.

The run, in numbers

Lines

12

Characters to type

276

Tokens

76

Three-star pace

70 tpm

At the three-star pace of 70 tokens a minute, this run takes about 65 seconds.

Type this snippet

Step 2 of 6 in Choices, step 10 of 25 in Forms & inputs.

← Previous Next →