<section> inside a <form>

Question

Is it a valid thing to put a <section> inside a <form>?

Now, I know it works, so I'm not asking whether it works or not. I also know that they both are (both section and form) "box-model" elements and "may be inlined inside each other" -- according to the W3 definitions. And yet, I'm wondering if it's a legit thing to do?

Example for clarity:

<form action="foo.bar">
 <section>
  <input type="foo" />
 </section>
</form>

Answer 1

In HTML5 you should use the tags that are most semantically appropriate for a given task.

And indeed there is a section tag for forms – it is called fieldset.

So instead of using a section tag inside your form, you might use a fieldset:

<form action="foo.bar">
    <fieldset>
        <legend>The fiedlset heading</legend>
        <input type="foo" />
    </fieldset>
</form>

Please also refer to the „html5 Doctor Element Flowchart“ (PNG, also as PDF).