HTML Tutorial / Explain Forms with fieldset, legend, and autocomplete

Use fieldset to group related form controls and legend to state the group's question. For fields such as a person's name or email address, a suitable autocomplete token can tell the browser what information the field requests.

Group one question with fieldset and legend

Individual radio labels describe the answers, but users also need the question those answers belong to. legend provides that group name.

<fieldset>
  <legend>How should we contact you?</legend>
  <label><input type="radio" name="contact" value="email"> Email</label>
  <label><input type="radio" name="contact" value="phone"> Phone</label>
</fieldset>

Open the example in a browser: a border and legend may appear by default. CSS can change that appearance without removing the relationship. The two radio inputs share name="contact" so choosing one clears the other. Use a separate fieldset for a separate question, and a different radio-group name; otherwise selecting an answer in one question could clear an answer in another.

Describe an input's purpose with autocomplete

<form action="/contact" method="post">
  <fieldset>
    <legend>Contact details</legend>
    <label for="full-name">Full name</label>
    <input id="full-name" name="full_name" autocomplete="name">
    <label for="email">Email address</label>
    <input id="email" name="email" type="email" autocomplete="email">
  </fieldset>
  <button type="submit">Send</button>
</form>

autocomplete="name" and autocomplete="email" describe the fields' purposes. They do not set a fixed value or submit information on behalf of the user. Whether a suggestion appears depends on browser settings and stored information. The name attribute is the server-side key; the autocomplete token is an input-purpose hint. /contact is an illustrative path and needs a server handler.

Check grouping and autofill

Do not put unrelated questions inside one fieldset, and do not scatter one radio question without a group name. Use defined autocomplete tokens rather than arbitrary words. Test two independent radio groups: if choosing an answer in the second clears the first, their name values probably match by mistake. Autofill does not validate the user's information, and forms collecting personal data still need suitable security and privacy practices. See the MDN autocomplete reference and fieldset reference.