div structure helper

[eluser]Neophyte[/eluser]
Just another take on markup for forms, its probably a little complex if youre typing out the markup by hand but assuming youre using some sort of helper or form builder i have found it to be extremely versatile in how it can be styled to match almost any site also without CSS enabled (say from a screen reader or mobile phone) the form remains extremely well structured and readable.

Code:

<form>
  <fieldset>
    <h3>Fieldset Legend</h3>
    <div class="note">Some text describing the fieldset here..</div>
    <ol>
      <li class="required">
        <label for="username">Username</label>
        <div>&lt;input type="text" name="username" id="username" /&gt;</div>
      </li>
      <li class="required">
        <label for="password">Password</label>
        <div>
          &lt;input type="password" name="password" id="password" /&gt;
          <span>Forgoten your password? click here</span>
        </div>
      </li>
      <li class="actions">
        &lt;input type="submit" name="login" value="Sign In" /&gt;
      </li>
    </ol>
  </fieldset>
&lt;/form&gt;