Disabling a whole section in HTML

One attribute on the fieldset takes every control inside it out of the form.

<fieldset disabled>
  <legend>Card details</legend>
  <label for="card">Card number</label>
  <input type="text" id="card" name="card" inputmode="numeric">
  <label for="cvc">CVC</label>
  <input type="text" id="cvc" name="cvc" inputmode="numeric">
</fieldset>

<p>Choose a payment method above to enable this section.</p>

How it works

1. disabled on a <fieldset> disables all its controls at once.
2. A disabled control is not focusable and its value is never submitted.
3. The first <legend> is exempt, so the heading stays interactive.

The run, in numbers

Lines

9

Characters to type

312

Tokens

76

Three-star pace

65 tpm

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

Type this snippet

Step 5 of 5 in Fields & labels, step 8 of 25 in Forms & inputs.

← Previous Next →