Each radio button in a "Shipping speed" choice already has its own <label>. Why wrap the set in a <fieldset> with a <legend>, and what does that add?

## The gap that per-control labels leave ```html <p>Shipping speed</p> <label><input type="radio" name="speed" value="std"> Standard</label> <label><input type="radio" name="speed" value="exp"> Express</label> ``` Every control here is correctly labelled. The markup is still incomplete, because each label names an *answer* and nothing names the *question*. Sighted users close the gap with proximity and typography — the heading sits above, in bigger text, so it obviously applies. A user moving through the form control by control gets "Standard, radio button, one of two" with no indication of what is being chosen. The heading is a paragraph; it has no relationship to the controls at all. ## What fieldset and legend do ```html <fieldset> <legend>Shipping speed</legend> <label><input type="radio" name="speed" value="std"> Standard</label> <label><input type="radio" name="speed" value="exp"> Express</label> <label><input type="radio" name="speed" value="ovn"> Overnight</label> </fieldset> ``` `<fieldset>` marks a set of controls as one group and carries an implicit `group` role. `<legend>` — which must be the **first child** of the fieldset — supplies that group's accessible name. The result is that the group boundary and its name exist in the markup rather than in the visual design, so assistive technology can tell the user what the group is when they enter it and, in many configurations, keep that context attached to the individual options. That is the whole mechanism, and it is worth stating that plainly in an interview: fieldset creates the group, legend names it. ## What fieldset does not do The most common misconception is that the fieldset is what makes radio buttons mutually exclusive. It is not. Radio exclusivity comes from the shared `name` attribute — all radios with the same name in the same form are one group, whether or not any fieldset is present, and radios in two different fieldsets that share a name are still one mutually exclusive set. Delete the fieldset and the behaviour is unchanged; only the accessible grouping is lost. So the fieldset is about *semantics and naming*, and `name` is about *behaviour and submission*. Keeping those two straight is exactly the distinction an interviewer is listening for. ## The disabled attribute `<fieldset disabled>` is a real and underused feature: it disables every form control descended from the fieldset, with one exception — controls inside the fieldset's first `<legend>` stay enabled. That exception exists so a legend can hold the toggle that re-enables its own section. It gives you a one-attribute way to switch off an entire step of a form without walking the controls yourself. ## When to use a fieldset, and when not to Use one when several controls only make sense together and share a single question: - a radio set ("Shipping speed", "Payment method") - a checkbox set answering one prompt ("Which newsletters?") - a small cluster of fields that form one unit, such as an address block or a date split across day/month/year controls Do not wrap every individual field in a fieldset. A fieldset around a lone text input adds a group with a name that merely repeats the field's own label, which produces duplicated announcements and noise — the classic over-application. And do not reach for a fieldset when what you actually have is a page section with a heading and a mix of unrelated content; that is a sectioning question, not a form-grouping one. ## Practical notes `<legend>` must be the first child of the `<fieldset>` for the association to hold; a legend placed after a wrapper div is not a legend for that fieldset in any useful sense. Keep legend text short — it may be conveyed alongside every option in the group, so a long sentence becomes something the user hears repeatedly. One nested case is worth knowing: if a group inside a group is genuinely necessary (a payment method choice whose "Card" option reveals card fields), nesting fieldsets is legal, but each extra level adds announcement depth. Prefer flattening the structure to nesting it. ## The interview answer in one breath "Individual labels name the options; nothing names the question. `<fieldset>` makes the set a group and `<legend>` names that group, so the choice is never presented without the thing being chosen. And to be clear, the fieldset isn't what makes the radios exclusive — the shared `name` attribute does that."