Semantically appropriate input title and field tag

Question

I have a form that lists the name of the input, the input, and possibly some help text. It is generally going to appear to be tabular, but I don't want to use a table or div because I imagine there is a more semantically-appropriate option by now.

Here is what it would look like without styles:

Name:    <name input>
Address: <address input>
         <address help info>
Phone:   <phone input>

Notice how it all lines up like a table.

Any ideas for the most appropriate HTML for this?

Answer 1

Use dl. It got redefined in HTML5 so that it’s a "description list" instead of a definition list.

<dl>

  <dt>Name:</dt>
  <dd>…</dd>

  <dt>Address:</dt>
  <dd>…</dd>

  <dt>Phone:</dt>
  <dd>…</dd>

</dl>

If it’s a form with input, don’t forget to use label.

Note that it’s not "required" to use an additional structure, so a form like this is totally fine without dl/table:

<label for="form-name">Name:</label>
<input type="text" id="form-name" name="form-name">

<label for="form-address">Address:</label>
<textarea id="form-address" name="form-address"></textarea>

<label for="form-tel">Telephone:</label>
<input type="tel" id="form-tel" name="form-tel">